0
我將非常感謝關於如何爲修改的輸入構建返回的插入位置邏輯的反饋。爲更改的輸入返回插入位置的邏輯
案例：我們有一個輸入，由JS處理，格式爲x999y999z9999，其中x，y，z - 是我們根據具體情況定義的分隔符。我們按照預期對其進行處理和修改，但是我似乎在邏輯上迷失了用於在可變長度的那些x，y和y的情況下返回用戶的光標位置。我甚至傾向於構建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。 （http://plnkr.co/）， [JS Bin]（https://jsbin.com/） 或片段（位於文本編輯器工具欄或CTRL + M上的第7個圖標）。 – zer00ne
根據您的建議，@ zer00ne，我在帖子中添加了代碼。 – Alpose
您是否希望在選中時計算這些分隔符（即x，y和z）？我可以爲你提供一個我剛回來的工作例子。有沒有理由爲什麼輸入不接受任何字母鍵？我找不到可能導致該行爲的代碼。 – zer00ne