jquery - 替换输入表单中的字符，但保留光标位置

Question

我需要创建一个日期输入表单，例如：

<input type="text" id="field" maxlength="10" value="__/__/____"/>

当用户输入日期值时，它应该用输入的值替换每个底线：

var firstValue= $("#field").val();

$("#field").keypress(function (e) {
  var pattern = /^\d*(\d*)?$/;
  var digit= String.fromCharCode(e.keyCode);
  if (digit.match(pattern)) {
    $("#field").val($("#field").val().replace("_", digit))
  }
  else 
    event.target.value = firstValue;
});

一切正常，除了光标在输入过程中一直固定在输入表单的末尾。有人知道为什么会这样吗？你能帮我让光标跟随输入吗？

Answer 1

无需重新发明轮子。改用jQuery Masked Input Plugin：

它允许用户更轻松地输入固定宽度的输入，您希望他们以某种格式（日期、电话号码等）输入数据。它已经在 Internet Explorer、Firefox、Safari 和 Chrome 上进行了测试。