如何覆盖选项卡或用户单击(焦点)上的焦点

时间:2014-06-19 06:10:45

标签: javascript jquery

在我的表单验证中,在提交时,我正在验证表单,找到未填充的元素并使用此函数进行聚焦:正常工作

switch (tagName) {
  case 'TEXT':
      if (!actualValue) {
          $(target).next('.error').css('display', 'block');
          that.submitIt = false;
          target.select();
      } else {
          $(target).next('.error').css('display', 'none');
          that.submitIt = true;
      }
      break;
  case "SELECT-ONE":
      if (actualValue === 'Select') {
          $(target).next('.error').css('display', 'block');
          that.submitIt = false;
          target.select();
      } else {
          $(target).next('.error').css('display', 'none');
          submitIt = true
      }
      break;
  case "RADIO":
  case "CHECKBOX":
      if (actualValue && actualValue !== 'undefined') {
          $(target).siblings('.error').css('display', 'none');
          that.submitIt = true;
      } else {
          $(target).siblings('.error').css('display', 'block');
          that.submitIt = false;
          target.select();
      }
      break;
}

但问题是,该功能不允许用户下一步移动(使用制表符或手动切换到下一个字段)。

如何覆盖标签或手动移动(焦点)或箭头键上的焦点?

Live Demo

1 个答案:

答案 0 :(得分:4)

问题在于target.select()行。每次验证输入字段并且验证失败时(例如,当您尝试离开字段时),它将重新选择相同的字段。

编辑:因为你在聚焦上验证然后重新选择我真的没有看到任何其他方法而不是删除target.select()。正如他们所说,你不能吃蛋糕和吃。另一种方法是仅在提交时进行验证。

例如,JQuery验证插件会在更改和焦点上将某个字段标记为无效,但不会选择它。可能是因为这个问题。