表單提交時出現jquery錯誤

Question

有一個注冊表，我檢查用戶名是否可用。 如果可用，則在用戶名字段旁邊顯示一個段落（“可用！”），如果沒有，則顯示（“不可用！”）。 如果用戶名不可用，我不想提交。

<script type ="text/javascript">

$(function(){
    $('#usernameFeedback').load('check.php').show();

    $('#usernameID').keyup(function(){

        $.post('check.php',{username:registration.username.value},
        function(result){
            $('#usernameFeedback').html(result).show();
            var feedVar = $('#usernameFeedback').text();

        });
    });
});
</script>


<script>

$(document).ready(function(){
   $("#regForm").submit(function(){
     alert("HELLO"); // works fine
     if ( $('#usernameFeedback').text() == "Not available!" )
        return;
   event.preventDefault();
   });
});

</script>

使用此代碼無法正常工作（我是jquery的新手），如果用戶名不可用，則不會停留在當前頁面中。

Answer 1

將事件傳遞給函數。

$("#regForm").submit(function(){

應該

$("#regForm").submit(function(event){

並且在if的同一行使用return false ，因為你沒有使用{}

試試這段代碼：

$(document).ready(function () {
    $("#regForm").submit(function (event) {
        event.preventDefault();
        alert("HELLO"); // works fine
        if ($('#usernameFeedback').text() == "Not available!") {return false;}
    });
});

Answer 2

沒有大括號的if()語句只會監聽它下面的第一個且唯一的語句。 如果包含大括號，則可以有多個語句，如下所示：

   if ( $('#usernameFeedback').text() == "Not available!" ) {
          event.preventDefault();
          return false;
      } else {
          return true;
      }

此外， event.preventDefault()將不會使用您當前的代碼執行，因為函數在它甚至能夠執行之前就已經離開了，因此我已經交換了它們，默認情況下會阻止它， 然后返回。

塞爾吉奧迅速而正確地提到，將event添加到功能中，甚至首先允許你使用event.preventdefault() ！