1

在有人正确填写我的表格后，我试图发送一条警告说“感谢注册”，但即使填写表格有误，有时它仍然会显示“感谢注册”。我正在使用 jQuery。

有人可以告诉我他们的想法吗？

http://codepen.io/dpcarlson/pen/nvwqk

HTML：

<h2>Form</h2>
  <h1>Validator</h1>
  <div>
      <p id="labelforusername">Your Name</p>
  </div>
  <div>
    <input type="text" id="username" >
  </div>
  <div>
      <p id="labelforpassword">Your Password</p>
  </div>
  <div>
    <input type="password" id="password" >
  </div>
  <div>
      <p id="labelforverify">Re-Enter Your Password</p>
  </div>
  <div>
    <input type="password" id="verify" >
  </div>
  <div>
      <p id="labelforemail">Your Email</p>
  </div>
  <div>
    <input type="text" id="email" >
  </div>
  <div id="submit">SUBMIT</div>

JS：

$(document).ready(function () {

  //Validate Form **********************

  $('#submit').click(function() {

    if($('#username').val().length === 0) {
      alert("Please Enter Your Name"), $('#username').css('background','rgba(0,0,600,0.3)');
    } else {
      $('#username').css('background', 'rgba(0,0,0,0.3)' );
    };

    if($('#password').val().length === 0) {
      alert("Please Enter Your Password"), $('#password').css('background','rgba(0,0,600,0.3)'), $('#verify').css('background','rgba(0,0,600,0.3)');
    } else if ($('#password').val().length <= 4) {
      alert("Please Make Your Password At Least 5 Characters"), $('#password').css('background','rgba(0,0,600,0.3)'), $('#verify').css('background','rgba(0,0,600,0.3)');
    } else {
      $('#password').css('background', 'rgba(0,0,0,0.3)'),
      $('#verify').css('background', 'rgba(0,0,0,0.3)');
    };

    if($('#password').val() !== $('#verify').val()) {
      alert("Oops, Seems Like Your Passwords Don't Match!"), $('#password').css('background','rgba(0,0,600,0.3)'), $('#verify').css('background','rgba(0,0,600,0.3)');
    };

    if($('#email').val().length === 0) {
      alert("Please Enter Your Email"), $('#email').css('background','rgba(0,0,600,0.3)');
    } else {
      $('#email').css('background', 'rgba(0,0,0,0.3)');
    };

  if ($('#password').val().length > 4 && 
    $('#password').val().length !== 0 &&
    $('#verify').val().length > 4 &&
    $('#verify').val().length !== 0 &&
    $('#username').val().length > 0 &&
    $('#username').val().length !== 0 &&
    $('#email').val().length !== 0 &&
    $('#email').val().length > 0 &&
    $('#password').val() === $('#verify').val()){
       alert("Thanks For Registering!")
}
  });

  //End Validate Form **********************

干杯。

4

1 回答 1

0

这是因为您的 if 语句的结构方式。在当前设计中，表达式与表达式列表一起使用以确定逻辑状态。但是，当在表达式中使用逗号分隔列表时，它不会构建，它只是一次计算一个。

因此，最后一个值是在 if 语句中与 true 进行比较的值。这意味着这提醒真实的事情

if((false,false,false,true)===true)alert("true");

所以真的为了显示“感谢注册”警报，所有必须是真的是

$('#password').val() === $('#verify').val()

实际上你可能想要这个

if ($('#password').val().length > 4 && 
    $('#password').val().length !== 0 &&
    $('#verify').val().length > 4 &&
    $('#verify').val().length !== 0 &&
    $('#username').val().length > 0 &&
    $('#username').val().length !== 0 &&
    $('#email').val().length !== 0 &&
    $('#email').val().length > 0 &&
    $('#password').val() === $('#verify').val()){
       alert("Thanks For Registering!")
}
于 2014-05-05T22:42:50.393 回答