Backbone.js Webshims-在初始加载时显示无效的表单字段

（后续问题来自）

我希望表单在加载时验证现有数据。我似乎无法实现这一点

• 我的每个控件和调用focus（）和blur（），还有比这更好的方法吗？我试图调用ctrl.checkValidity（），但它并不总是被定义的。当它是，它仍然没有标记的控制
• 我似乎也有时间问题，当focus和blur（）启动时，UI不会更新。这就好像Webshims还没有完全加载，即使在$.Webshims.ready事件中触发
• 我还尝试调用$（'#form'）.submit（），但这并没有像我预期的那样触发事件。我能做到这一点的唯一方法是包含一个输入类型class='submit'。我怎样才能像单击提交按钮那样实际地对表单验证进行案例分析

这里有一个例子来说明这个问题。当表单加载时，我希望将无效电子邮件标记为这样。如果单击“添加”按钮，则会标记它，但不会在最初加载时标记。为什么?

• 控件中的焦点和模糊将导致标记该控件
• 但是，单击ADD也会（它运行的方法与加载时运行的方法相同）。为什么它第二次工作，但在最初加载时不工作

  updateValidation : function ()  {
  this.$el.find('[placeholder]').each(function (index, ctrl) {  
      var $ctrl = $(ctrl);
      if( $ctrl.val() !== "" && (ctrl.checkValidity && !ctrl.checkValidity()) ) {
          // alert('Do validity check!');
          $ctrl.focus();
          $ctrl.blur();
      }
  });
  }
  

---

我在FF 17.0.5中看到了这一点。IE9中的问题更严重，有时在字段显示错误之前，需要单击2或3次ADD。但是，由于mime类型不匹配，我喜欢的一些js文件出现错误。

这与您试图重用.user error类有关，该类是CSS4:user error的“垫片”，不应该从脚本触发。用户错误脚本在onload之后加载，或者在用户似乎与无效的from进行交互时加载

在我看来，您不应该使用user error，而应该创建自己的类。您只需使用“：invalid”选择器检查有效性：

$(this)[ $(this).is(':invalid') ? 'addClass' : 'removeClass']('invalid-value');

只需编写一个具有类似代码的函数，并将它们绑定到诸如更改、输入等事件，然后在启动时调用它

如果您仍然希望使用user error，可以执行以下操作，但我不建议您这样做：

$.webshims.polyfill('forms');
//force webshims to load form-validation module as soon as possible
$.webshims.loader.loadList(['form-validation']);
//wait until form-validation is loaded
$.webshims.ready('DOM form-validation', function(){
    $('input:invalid')
        .filter(function(){
            return !!$(this).val();
        })
        .trigger('refreshvalidityui')
    ;
});

---

完美的第一个选项非常有效！非常简洁的代码-我喜欢它。虽然我知道你不推荐第二种选择，但这也是模仿输入类型submit的技术吗？我真的不明白，你到底想要什么。本机验证UI仅在用户提交或脚本化type=“submit”单击时显示。第二个选项模拟：user error pseudo，这意味着该字段无效+被用户触摸。