Question

我正在使用jQuery Validate插件进行验证。我必须在表单上进行实时验证。例如，如果需要名字，那么用户应首次获得所需的消息，并在他开始输入文本框时进入。

为了实现此功能，我在插件的onkeyup和onfocusout选项上使用。为此，我请提及具有相同问题的this link。

以下是表单验证的 coffeescript 代码

defaultPageForm: (self)->
      form = $("#PageForm")
      if form.length > 0
        form.find('textarea').on 'click', -> $(@).valid()
        form.find('input').on    'click', -> $(@).valid()
        form.validate    

          ignore: ".ignore"                        
          rules:
            "view[name]":
              required: true
              NameWordCount: [3]


            "view[comment]":
              required: true
              CommentWordCount: [5]

            accept_terms: "required"

          messages:
            "view[comment]": "Please add comment"

          errorElement: "span"
          errorClass: "error_msg wide "
          errorPlacement: (error, element) ->
            element.siblings(".view_form_error_msg").remove()
            error.appendTo element.closest(".controls")              
            return

          ###### Real time validation code #############
          onkeyup: (element) -> 
            $(element).valid()  
            return        

          onfocusout: (element) -> 
            $(element).valid()  
            return 

          submitHandler: (form) ->
            self._setupData()
            self._submitForm(form)
            off

      return

但它没有正常工作。例如，出于测试目的，我在onkeyup下添加了警告消息，但没有弹出任何内容，也没有应用实时验证。

我有什么遗失的吗？这是我的HTML

<input type="text" value="as as" size="50" placeholder="Full Name" name="view[name]" id="customerName" class="string required wide" style="font-size: 20.4572px; line-height: 49px;">

那么我该如何解决这个问题。

Answer 1

您永远不会在.valid()方法中使用.validate()方法。请参阅onkeyup和onfocusout的源代码，了解它是如何完成的。

使用this.element(element)代替$(element).valid()

要覆盖onkeyup和onfocusout的默认功能（“懒惰验证”）并改为使用“急切”验证......

$('#myform').validate({
    onkeyup: function(element) {
        this.element(element);  // <- "eager validation"
    },
    onfocusout: function(element) {
        this.element(element);  // <- "eager validation"
    }
    ....

DEMO：http://jsfiddle.net/ajy5j8jq/

onkeyup和onfocusout在jQuery Validate中不起作用

1 个答案: