How to prevent deletion of an html snippet?

Asked

Viewed 93 times

-1

Good Morning Guys, I have the code

<Sua IMAGEM ESTÁ AQUI NÃO APAGUE ESTE CODIGO> 

VÁRIOS CODIGOS HTML AQUI DENTRO.

</Sua IMAGEM ESTÁ AQUI NÃO APAGUE ESTE CODIGO>

What do I want to do? I want to know if it is possible for me to prevent what you have with the tag <Sua IMAGEM ESTÁ AQUI NÃO APAGUE ESTE CODIGO> e fechando </Sua IMAGEM ESTÁ AQUI NÃO APAGUE ESTE CODIGO> I want to make it impossible for the user to delete this excerpt with these tags, or it will give a Space and the text will return. Or Backspace being inactive in these snippets is possible?

jquery

  • If possible, please the code? I tried and I could not , thank you.

2 answers

1

You can add this code to a hidden element, and then go checking, with each modification, if it is in the textarea.

/* Captura o valor dos dados que NÃO podem ser apagados */
var elementoOculto = document.querySelector("#elemento-oculto");

/* Captura o valor da caixa de edição */
var elementoNormal = document.querySelector("#elemento-normal");

/* Adiciona evento para detectar a tecla pressionada antes da ação dela. */
elementoNormal.addEventListener("keydown", function(e) {
  if (e.keyCode === 8 || e.keyCode === 46) {
  
    /* Captura onde o cursor está localizado no textarea "normal" */
    let selectionStart = this.selectionStart;
    let selectionEnd = this.selectionEnd;
    
    /**
     * Subtrai a posição de início para n-1, dessa forma será
     * possível capturar a letra anterior a posição do cursor
     */
    if (selectionStart === selectionEnd) {
      selectionStart--;
    }
    
    /* Caso o usuário aperte a tecla Delete, captura a letra seguinte. */
    if (e.keyCode === 46 && (selectionEnd - selectionStart) === 1) {
      selectionStart++;
      selectionEnd++;
    }
    
    /* Captura a letra ou seleção de letras deletadas. */
    let newValue = this.value.slice(0, selectionStart) + this.value.slice(selectionEnd);
    
    /* Verifica se o novo valor possui o mesmo código da textarea elemento oculto */
    if ( newValue.indexOf(elementoOculto.value) === -1 ) {
    
      /* Caso não possua o mesmo valor, impede a ação do usuário. */
      e.preventDefault();
      return false;
    }
  }
})
#elemento-oculto {
  display: none;
  visibility: 0;
  opacity: 0;
}
<!-- Adicione no valor desse elemento, O CÓDIGO QUE NÃO PODERÁ SER DELETADO. -->
<textarea id="elemento-oculto"><Sua IMAGEM ESTÁ AQUI NÃO APAGUE ESTE CODIGO> 

VÁRIOS CODIGOS HTML AQUI DENTRO.

</Sua IMAGEM ESTÁ AQUI NÃO APAGUE ESTE CODIGO></textarea>




<!-- Esse outro elemento, é onde o usuário poderá deletar os dados. -->
<textarea id="elemento-normal" rows="10" cols="60">
Blá blá blá blá
<Sua IMAGEM ESTÁ AQUI NÃO APAGUE ESTE CODIGO> 

VÁRIOS CODIGOS HTML AQUI DENTRO.

</Sua IMAGEM ESTÁ AQUI NÃO APAGUE ESTE CODIGO>

Blá blá blá blá

</textarea>

-1

This should work for you

$(document).keydown(function(e) {
   var elid = $(document.activeElement).hasClass('textInput');
   if (e.keyCode === 8 && !elid) {
    return false;
   };
});

o e.keycode is the identification of the keyboard Backspace key. Need to adapt to your form

Browser other questions tagged jquery

You are not signed in. Login or sign up in order to post.