Question

如何从以下文本框重新编辑字母

＆＃13;

$('.zip-code').on('keypress change', function () {
  $(this).val(function (index, value) {
    return value.replace(/\W/gi, '').replace(/(.{3})/g, '$1 ');
  });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="label" for="credit-card">zip Code</label>
<input type="text" maxlength="7" class="zip-code" value="" autocomplete="off"  />

＆＃13;

上面的代码在3个字母后面给出空格，但无法重新编辑字母

以下是面临的问题：

应删除整个邮政编码以编辑文本框中的字母
如果输入的邮政编码错误且需要编辑，则无法编辑邮政编码字段中的字母/字母。
编辑邮政编码后，信件移到最后。

Answer 1

这里的问题是一些问题。首先，您希望使用keyup来获取值，否则它将在键值设置之前触发，并且在调用时不会给出准确的值。其次，你的正则表达式正在运行，而你可能仍在键入，这会强制光标结束。您可以使用计时器（Borrowed from this answer）克服此问题。

尝试下面的代码段，我相信这可以完成您的目标。

＆＃13;

var typingTimer;                //timer identifier
var doneTypingInterval = 1000;  //time in ms, 1 second for example
var $input = $('.zip-code');

//on keyup, start the countdown
$input.on('keyup', function () {
  clearTimeout(typingTimer);
  typingTimer = setTimeout(formatZip, doneTypingInterval);
}).on('keydown', function () {
  clearTimeout(typingTimer);
});

function formatZip () {
  $input.val(function (index, value) {;
    var str = value.replace(/\W/gi, ''),
        newVal = [str.slice(0, 3), ' ', str.slice(3,6)].join('');
    return newVal;
  });
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label class="label" for="credit-card">zip Code</label>
<input type="text" maxlength="7" class="zip-code" value="" autocomplete="off"  />

＆＃13;

在jQuery中的文本框中的三个字母后添加空格时无法编辑文本框中的字母

1 个答案: