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