jQuery验证器HTML表单

Question

我正在尝试使用jquery验证程序来验证表单文本框，它可以与zend-framwork表单一起正常工作，但不适用于任何HTML表单，并且代码如下：1）这是html页面中的脚本：

<script>
    $("#newsletter").validate({
        rules: {
            newsletter_input:{
                email: true
            }
        }
    });
</script>

2）这是表格：

  <form id="newsletter">
  <input type="text" name="newsletter-input" id="newsletter_input" class="clickable_search email " title="enter your e-mail" value="enter your email" />
  <input type="submit" value="" id="newsletter-submit" />
   </form>

我在这里想念什么？？？

Answer 1

您是否在页面上包括了jQuery脚本？

简单尝试：

<script>
$(document).ready(function() {
    $("#newsletter").validate();
});
</script>

并将required作为类添加到时事通讯电子邮件输入中。

<form id="newsletter">
<input type="text" name="newsletter-input" id="newsletter_input" class="clickable_search email required" title="enter your e-mail" value="enter your email" />
<input type="submit" value="Submit" id="newsletter-submit" />
</form>

那应该工作。

Answer 2

<script>
$("#newsletter-submit").click(function() {
    $("#newsletter").validate({
        ..
    });
});
</script>

Answer 3

validate对象的rules属性在元素的name属性上起作用，而不是id起作用，因此您的脚本代码应为：

<script>
    $(document).ready(function() {
        $("#newsletter").validate({
            rules: {
                "newsletter-input":{
                    email: true
                }
            }
       });
    });
</script>

请注意-而不是_。

同样值得注意的是，由于字段名称中的破折号不是合法的javascript标识符，因此您需要引用字段名称才能使规则生效。

就个人而言，我会避免在name和id属性中使用破折号，而应使用Camel大小写

Answer 4

 <form id ="myform">
 <input type="text" name="newsletter" id="newsletter" class="clickable_search required email " title="أدخل البريد الإلكتروني" value="أدخل البريد الإلكتروني" />
 <input type="submit" value="" id="newsletter-submit" />
 </form>
 <script>
  $(document).ready(function(){
  $("#myform").validate({
  rules: {
  field: {
  required: true,
  email: true
     }
    }
   });
  });
  </script>

这是与我合作在表单上添加ID的唯一方法