0
変更された入力のためにキャレット位置を返すロジックを構築する方法について、感謝の意を表します。変更された入力のキャレット位置を返すロジック
ケース：JSで処理された入力があり、x999y999z9999のようにフォーマットされています。ここでx、y、zはケースバイケースで定義された仕切りです。私たちは意図したとおりに処理し、それを変更しますが、私は可変長のx、y & zのコンテキストでユーザーのキャレットの位置を返すためにロジックが失われているようです。これらの長さの変動に対応して、if \ elseの全体の複雑さを構築することはちょっと気になりますが、おそらくもっと簡単な解決法があります。
ありがとうございます！
コード例：https://jsfiddle.net/zktva4kc/
function doGetCaretPosition (field) {
if (!!field){
\t var CaretPos = 0;
\t // IE Support
\t if (document.selection) {
\t \t field.focus();
\t \t var Sel = document.selection.createRange();
\t \t Sel.moveStart ('character', -field.value.length);
\t \t CaretPos = Sel.text.length;
\t }
\t // Firefox support
\t else if (field.selectionStart || field.selectionStart == '0')
\t \t CaretPos = field.selectionStart;
\t return (CaretPos);
}else{
\t console.log("No such field exist here for function initiation.");
}
}
function setCaretPosition(field, pos)
{
if (!!field){
\t if(field.setSelectionRange)
\t {
\t \t field.focus();
\t \t field.setSelectionRange(pos,pos);
\t }
\t else if (field.createTextRange) {
\t \t var range = field.createTextRange();
\t \t range.collapse(true);
\t \t range.moveEnd('character', pos);
\t \t range.moveStart('character', pos);
\t \t range.select();
\t }
}else{
\t console.log("No such field exist here for function initiation.");
}
}
function formatItDown(field, format) {
if (!!field){
field.oninput = function() {
\t \t var position=doGetCaretPosition(field);
\t \t var sInput=this.value;
var input = this.value;
input = input.replace(/[^\d]/gi, "");
var first = input.substr(0, 3);
var second = input.substr(3, 3);
var third = input.substr(6, 4);
if (input.length > 3) {
first = format[0] + first + format[1];
}
if (input.length > 6) {
second = second + format[2];
\t \t \t
}
formatted = first + second + third;
\t \t //x012y456z8901
\t \t /* this here is the problem area when we use some complex formats
\t \t if ((formatted[3]!=sInput[3])&&(position>3)&&(position<6)){
\t \t \t position=position+1;
\t \t }else if ((formatted[7]!=sInput[7])&&(position>7)){
\t \t \t position=position+1;
\t \t }*/
\t \t
this.value = formatted;
\t \t
\t \t setCaretPosition(field, position);
}
\t
}else{
\t console.log("No such field exist here for function initiation.");
}
}
formatItDown(document.getElementById('exampleInput'), ["--","==","__"]);<input id='exampleInput'>
99％が[MCVE（** M ** inimal、** C ** omplete、及び**を有することが必要とされる一回使用の良いプラグインですV ** erifiable ** E ** xample）]（http://stackoverflow.com/help/mcve）を参照してください。 あなたの質問に関連するJavaScript/jQuery、CSS、およびHTMLを投稿してください。 [jsFiddle.net]（https://jsfiddle.net/）、 [CodePen.io]（https://codepen.io/）、 [Plunker]のいずれかまたはすべてを使用してデモを作成します。 [JS Bin]（https://jsbin.com/） またはスニペット（テキストエディタのツールバーにある7番目のアイコン、またはCTRL + M）をクリックします。 – zer00ne
あなたの提案によると、@ zer00ne、私はポストにコードを追加しました。 – Alpose
これらの区切り文字（x、y、zなど）を選択するとカウントされますか？私はしばらく前に作った実例をあなたに提供することができます。入力がアルファベットキーを受け入れない理由はありますか？あなたのコードのどこにその振る舞いを引き起こすかはわかりませんでした。 – zer00ne