Chromeの入力値の末尾にカーソルの位置が異常にあります

Question

入力ボックスにテキストを書き込むときに、一重引用符と二重引用符を自動的に削除するjQuery関数を記述しました。 Firefoxではすべてがうまくいくが、Chromeでは、テキストの先頭に何かを追加したい場合は許可されない。カーソルは常に入力値の最後に位置するためです。私はそれをどのように修正するかわかりません。変更

$.fn.removeQuotes = function() 
{ 
    var elem = $(this); 
    elem.bind("focus propertychange change click keyup input paste", function(event) 
    { 
     // store current positions in variables 
     var start = this.selectionStart, 
     end = this.selectionEnd; 
     setTimeout(function() 
     { 
      elem.val(elem.val().replace(/['"]/g, "")); 
     }, 1); 
     // restore from variables... 
     this.setSelectionRange(start, end); 
    }); 
}; 

しかし、何も：コメントの後、私はこれを試してみました：

$.fn.removeQuotes = function() 
{ 
    var elem = $(this); 
    elem.bind("focus propertychange change click keyup input paste", function(event) 
    { 
     setTimeout(function() 
     { 
      elem.val(elem.val().replace(/['"]/g, "")); 
     }, 1); 
    }); 
}; 

編集：ここに私のコードです。

Answer 1

ここでは、上に構築するための粗バージョンだ - https://jsfiddle.net/Sanjeevi/79gun3g0/1/

<div> 
     <input id="text-box" type="text"> 
    </div> 

$.fn.removeQuotes = function() 
{ 
    var elem = $(this); 
    elem.bind("keyup", function(event) 
    { 
       var start = elem.caret(); 
      console.log(start); 
      elem.val(elem.val().replace(/['"]/g, "")); 
      setCaretPosition('text-box',start); 
    }); 
}; 

function setCaretPosition(elemId, caretPos) { 
    var elem = document.getElementById(elemId); 

    if(elem != null) { 
     if(elem.createTextRange) { 
      var range = elem.createTextRange(); 
      range.move('character', caretPos); 
      range.select(); 
     } 
     else { 
      if(elem.selectionStart) { 
       elem.focus(); 
       elem.setSelectionRange(caretPos, caretPos); 
      } 
      else 
       elem.focus(); 
     } 
    } 
} 

$(document).ready(function(){ 
    $("#text-box").removeQuotes(); 
});