为什么笑脸禁用 REGEXP 会导致无法编辑文本？

Question

我使用了以下 RegExp 来禁用文本框中的笑脸符号。它工作正常。

title = title.replace(/[^a-zA-Z 0-9.~`!@#$%^&*()_+-={}|:;<>,.?\/'"\[\]]+/g,'');

但是当我这样做的时候，我遇到了一个问题。如果我尝试编辑该文本框中的文本，光标将移至文本末尾。

假设 "How are you?" 是在文本框中输入的文本。如果我尝试在 'how' 和 'are' 之间添加 'old'，光标将移动到文本的末尾。

jQuery('#topic_title').bind('input propertychange', function(e) {
    title = jQuery("#topic_title").val(); 
    title = title.replace(/[^a-zA-Z 0-9.~`!@#$%^&*()_+-={}|:;<>,.?\/'"\[\]]+/g,'');
    jQuery("#topic_title").val(title); });

当我删除 RegExp 时，可以进行编辑。我希望这个问题与 RegExp 有关。请帮我找到解决办法。

Answer 1

发生这种情况是因为每次更改（每次按键）后都会进行替换。您可以将 bind('input propertychange' 替换为 bind('blur'。这将在输入框失去焦点后删除表情符号。

或者您需要在替换文本之前存储光标位置，然后将光标设置到原始位置。这是一个如何做的例子

jQuery('#topic_title').bind('input propertychange', function(e) {
    title = jQuery("#topic_title").val(); 
    var caretPosition = getCaret(this);
    title = title.replace(/[^a-zA-Z 0-9.~`!@#$%^&*()_+-={}|:;<>,.?\/'"\[\]]+/g,'');
    jQuery("#topic_title").val(title); 
    setCaretToPos(this, caretPosition);     
});

function getCaret(node) {
  if (node.selectionStart) {
    return node.selectionStart;
  } else if (!document.selection) {
    return 0;
  }

  var c = "[=10=]1",
  sel = document.selection.createRange(),
  dul = sel.duplicate(),
  len = 0;

  dul.moveToElementText(node);
  sel.text = c;
  len = dul.text.indexOf(c);
  sel.moveStart('character',-1);
  sel.text = "";
  return len;
}

function setSelectionRange(input, selectionStart, selectionEnd) {
    if (input.setSelectionRange) {
      input.focus();
    input.setSelectionRange(selectionStart, selectionEnd);
  }
  else if (input.createTextRange) {
    var range = input.createTextRange();
    range.collapse(true);
    range.moveEnd('character', selectionEnd);
    range.moveStart('character', selectionStart);
    range.select();
  }
}

function setCaretToPos (input, pos) {
  setSelectionRange(input, pos, pos);
}

演示：http://jsfiddle.net/11c1z774/

为什么笑脸禁用 REGEXP 会导致无法编辑文本？

Why smiley disabling REGEXP causes editing of text impossible?

regex

jquery