JQUERY验证没有执行点击事件

请问任何人告诉我我在做什么错误的代码如下。它不在Click上执行。我安静的音符肯定阉$("form").validate上适用于提交按钮：

的jQuery：

 $(document).ready(function() { 
      //Form Submit 
      $('#ClockOutBtn').click(function() { 
       $("form").validate({ 
        rules: { 
         name: "required", // simple rule, converted to {required:true} 
         email: {// compound rule 
          required: true, 
          email: true 
         }, 
         url: { 
          url: true 
         }, 
         comment: { 
          required: true 
         } 
        }, 
        messages: { 
         comment: "Please enter a comment." 
        } 
       }); 
      }); 



     });

HTNML：

<fieldset> 
     <div class="form-row"><span class="label">Name *</span><input type="text" name="name" /></div> 
     <div class="form-row"><span class="label">E-Mail *</span><input type="text" name="email" /></div> 
     <div class="form-row"><span class="label">URL</span><input type="text" name="url" /></div> 
     <div class="form-row"><span class="label">Your comment *</span><textarea name="comment" ></textarea></div> 

     <button id="ClockOutBtn" type="button"/> 
    </fieldset>

来源

2011-03-28 Nil Pun

比的onClick我认为是对的形式提交：

$("form").bind('submit',function(){ 
     this.validate(etc...) 
     if(valid_criteria) 
      return true // submit 
     else 
      return false // don't submit 
    })

来源

2011-03-28 10:43:14

谢谢，但我不能提交类型按钮。它需要是一个图像（在这里不能显示，因为它说垃圾邮件）。它需要点击图像的事件。 – 2011-03-28 11:04:28

提交按钮也可以作为图像样式。你需要通过CSS包含一个背景图像。 – 2011-03-28 11:07:00

就我所见，您的<input>字段没有ID和验证功能将名称与<input>字段中的ID匹配。此外，我没有看到任何<form>标签在你<input>领域，所以你不能说$("form")....

编辑：

你并不需要一个click事件为您的按钮，因为插件自动处理当提交按钮被点击时。
每个输入字段需要一个ID
你需要包括jQuery库的验证插件
你需要有在你的输入字段

一个<form>标签有一个看看这个：jsfiddle

的jQuery：

$(document).ready(function() { 



    $("#ClockOutBtn").click(function(){ 
     $("#testForm").validate({ 
        rules: { 
         name: "required", // simple rule, converted to {required:true} 
         email: {// compound rule 
          required: true, 
          email: true 
         }, 
         url: { 
          url: true 
         }, 
         comment: { 
          required: true 
         } 
        }, 
        messages: { 
         comment: "Please enter a comment." 
        } 
       }); 
    }); 

});

HTML：

<html> 
    <head> 
     <script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8/jquery.validate.js"></script> 
    </head> 
    <body> 

     <form id="testForm"> 
<fieldset> 
     <div class="form-row"><span class="label">Name *</span><input type="text" name="name" id="name" /></div> 
     <div class="form-row"><span class="label">E-Mail *</span><input type="text" name="email" id="email" /></div> 
     <div class="form-row"><span class="label">URL</span><input type="text" name="url" id="url" /></div> 
     <div class="form-row"><span class="label">Your comment *</span><textarea name="comment" id="comment" ></textarea></div> 

    <button id="ClockOutBtn">Test</button> 


    </fieldset> 
     </form> 
     </body> 
     </html>

来源

2011-03-28 10:47:32

这是mvc应用程序，我没有放置表单标签，而是在实际的Web应用程序中。我想在用户点击图像时验证表单。我无法提交提交按钮，因为我还没有弄清楚如何在提交按钮上放置图像。 – 2011-03-28 11:06:45

我更改了我的答案，以便该示例适用于单击事件。 – 2011-03-28 11:18:03

JQUERY验证没有执行点击事件

回答

相关问题