0

我有一个联系表单，我试图添加一个简单的验证码，将两个数字加在一起，并在发送表单时显示successMessage div。我的表格是这样的；

<form method="post" action="" id="contact">

<div id="successMessage" style="display:none;">Message sent</div>

<label for=name accesskey=U><span class="required">*</span> Your Name</label>
<input name="name" type="text" id="name" size="30" value="" />

<br />
<label for=email accesskey=E><span class="required">*</span> Email</label>
<input name="email" type="text" id="email" size="30" value="" />

<br />
<label for=phone accesskey=P><span class="required">*</span> Phone Number</label>
<input name="phone" type="text" id="phone" size="30" value="" />

<br />

<label for=comments accesskey=C><span class="required">*</span> Your Comments</label>
<textarea name="comments" cols="26" rows="8" id="comments"></textarea>

<hr />

<p style="margin:0px; padding:0px;"><span class="required">*</span>Are You Human?</p>

<label for=verify accesskey=V>3 + 1 =</label>
<input name="verify" type="text" id="verify" size="6" value="" />

<input name="contactus" type="submit" class="submit" id="contactus" value="Submit" />

</form>

<script type="text/javascript">
$(function() {

  $.validator.addMethod("verify", function(value, element, params) {
      return this.optional(element) || value == params[0] + params[1];
  }, jQuery.validator.format("Please enter the correct value for {3} + {1}"));

  $("#contact").validate({

      success: function(label) {
              label.hide();
      },  
      rules: {
          name: {required: true},
          email: {
            email: true,
            required: true
          },
          phone: {
            digits: true
          },
          comments: {required: true}
      },
      messages: {
          name: "Please tell us your Name",
          email: "Please enter a valid email address",
          comments: "Please enter your comments"
      }

  });
});
</script>

您可以看到我已经尝试使用 addMethod 来验证是否有人在验证字段中输入了 4，但它没有验证该字段。

如果有人可以帮助我使其正常工作并在提交表单时显示全局成功消息，我将不胜感激。

谢谢你。

4

2 回答 2

0

只是让大家知道您需要解析 Integer，因为该值是一个字符串。你正在做一个平等，所以他们都需要是整数。

只需像这样用 parseInt 包装“值”：

return this.optional(element) || parseInt(value, 10) == params[0] + params[1];
于 2014-03-07T08:09:32.777 回答
0

您指定了方法，但您没有使用它。这是Javascript中的简单修复。

<script type="text/javascript">
$(function() {
  $.validator.addMethod("verify", function(value, element, params) {
      return this.optional(element) || parseInt(value, 10) == params[0] + params[1];
  }, jQuery.validator.format("Please enter the correct value for {0} + {1}"));
  $("#contact").validate({
      success: function(label) {
              label.hide();
      },  
      rules: {
          name: {required: true},
          email: {
            email: true,
            required: true
          },
          phone: {
            digits: true
          },
          comments: {required: true},
          verify:{
            verify:[3, 1]
          }
      },
      messages: {
          name: "Please tell us your Name",
          email: "Please enter a valid email address",
          comments: "Please enter your comments"
      }
  });
});
</script>
  1. 将错误消息更新为“{0} + {1}”。
  2. 称为验证字段的验证方法。我可能会使用不同的名称，或者可能会对字段和自定义方法感到困惑。
于 2013-08-02T13:39:13.510 回答