1

我有一个 web 表单,如果我的函数验证表单在该函数中返回 true,则提交我写了一个 if 语句,如果另一个名为 usernamecheck 的函数返回 true,则返回 validateform 函数为 true。除非您单击按钮检查用户名,否则我不希望提交表单。我知道我写的不是最好的方式我希望你能理解

<!-- Signup Form -->

  <form name='signup' action="subscription.php" onsubmit="return validateForm();" method="post" >


    <input type="text" id="signupUsername" name="signupusername" placeholder="Business Name" tabindex=1 required>

    <input type="password" id="signupPassword" placeholder="Password" name="signuppassword" tabindex=2 required> <br>

    <input type="text" id="ownerName" placeholder="Owner's Name" name="ownername" tabindex=3 required>

    <input type="email" id="signupEmail" placeholder="Email" name="signupemail" tabindex=4 required> 

    <input type="tel" id="signupphoneNumber" placeholder="Phone Number" name="signupphonenumber" tabindex=5 required>

    <input type="image" id="signupSubmit" src="images/signupBtn.jpg">

    <input type="text" id="city" placeholder="City" name="city" tabindex=6>

    <input type="text" id="state" placeholder="State" name="state" tabindex=7>

这是您单击以检查用户名是否存在的按钮

    <input type="button" id='check' value="Check It">

//

  </form>

  <script type="text/javascript">

下面有一个功能,如果您单击上面的按钮,它会检查功能 usernamecheck

 $(function() {
 $( "#check" ).click(function() {
 return usernamecheck();
 });
 });

下面是 validateForm 函数,如果 usernamecheck 返回 true,它也会返回 true 并提交表单

function validateForm()
{

  if(usernamecheck() && $("#signupUsername").val().length < 4) {

    return true;

  }

}


function usernamecheck() {

 $.post( "checkusername.php", { username: $("#signupUsername").val() })
  .done(function( data ) {

     result = JSON.parse(data);


      if(result["status"]== "Username is taken") 

  {

          alert("username is taken");
          return false;          

  }

  else if(result["status"]== "Username is Available") {

    alert("username is Available");
    return true;

}

else {

alert('You did not check the username');

}

});

}



</script>



<!-- Map Logo -->
<img src='images/map.jpg' id="map" class='menuitems'>
<!-- About Us Logo -->
<img src='images/aboutus.jpg' id="aboutus" class='menuitems'>
<!-- People Logo -->
<img src='images/people.jpg' id="people" class='menuitems'>

  </div>    

  </div>
 </div>


</body>

</html>
4

0 回答 0