Question

我有3个内联输入文本字段来输入日期

<form>
  <input type="text" name="day" />
  <input type="text" name="month" />
  <input type="text" name="year" />
</form>

有趣的领域是日和月。它们最多可包含2个数字。输入一天后，例如“05”，我希望光标跳转到月份字段，以便在不按Tab键或单击下一个字段的情况下在所有3个输入中键入整个日期。一个限制是，如果用户之前已经输入了日期，则表单字段将填充该日期，因此日期字段可能已包含“05”。如果我现在点击它，光标不应该已经跳转，以便我可以进入新的一天必须已经存在一些（jquery）代码片段来执行此操作？

Answer 1

试试这一点JS：

function moveToNext(field,nextFieldID){
  if(field.value.length >= field.maxLength){
    document.getElementById(nextFieldID).focus();
  }
}

然后将其添加到您的字段中：

<input type="text" id="dd" maxlength=2 onkeyup="moveToNext(this,'mm')"/>
<input type="text" id="mm" maxlength=2 onkeyup="moveToNext(this,'yyyy')"/>
<input type="text" id="yyyy" maxlength=4 />

Example

Answer 2

我使用这个漂亮的插件，它完全符合Merion的要求：

Autotab：jQuery自动标签和过滤器。

JavaScript日期/生日输入字段跳转

2 个答案: