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 case

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的唯一方法

jquery验证器HTML表单

4 个答案: