preventDefault（）導致提交的表單重定向到另一個頁面？

Question

我有一個產品頁面的格式如下：

<form id="ratingsForm" action='../resources/add_rating_to_product.php' method="POST"> 
    <input type="hidden" name="productID" value="<?php echo $productID; ?>" /> 
    <span class="rating"> 
     <input type="radio" class="rating-input" 
        id="rating-input-1-5" name="rating" value="5"> 
     <label for="rating-input-1-5" class="rating-star"></label> 
     ... 
     <input type="radio" class="rating-input" 
        id="rating-input-1-1" name="rating" value="1"> 
     <label for="rating-input-1-1" class="rating-star"></label> 
    </span> 
</form> 

這是採用單選按鈕只是一個簡單的星級形式。 我有一個JavaScript文件一旦單選按鈕被點擊

$(document).ready(function() { 
    $('input[name=rating]').change(function(){ 
      $('form').submit(); 
    }); 
}); 

，將提交表單我有另一個JavaScript文件時，提交表單和使用AJAX將其發佈到正確的文件，將觸發。

$(document).ready(function() { 

    $("#ratingsForm").on("submit",function(e){ 
     e.preventDefault(); 
     $.ajax({ 
      type: "POST", 
      url: $(this).attr('action'), 
      data: $(this).serialize(), 
      success: function(response) { 
       alert('Thanks for rating'); 
      } 
     }); 
    }) 
}); 

Add_rating_to_product只是發佈信息並將其插入到數據庫中。

我遇到的問題是，而不是防止和重定向，e.preventDefault重定向我的搜索頁面顯然沒有理由。我在我的產品頁面中檢查了我的所有代碼，並且沒有什麼可以將我重定向到那裏，所以問題是什麼？沒有preventDefault()，它按預期重定向到add_rating_to_product.php。

Answer 1

您有沒有可能在您的網頁上有其他表單？如果你這樣做，下面的代碼提交頁面上的所有形式：

$(document).ready(function() { 
    $('input[name=rating]').change(function(){ 
      $('form').submit(); 
    }); 
}); 

我認爲這將是更安全的做到以下幾點：

$(document).ready(function() { 
    $('input[name=rating]').change(function(){ 
      $(this).closest('form').submit(); 
    }); 
}); 

Answer 2

成功函數電話後，您可以使用

$(this).unbind('submit').submit() 

，這將允許繼續執行，就好像的preventDefault爲新臺幣稱爲

Answer 3

試試這個：

$(document).ready(function() { 
    $('input[name=rating]').change(function(e){ 
    e.preventDefault(); 

     var prodID = $(this).find("input[name='productID']").val(); 

     $.ajax({ 

     type: "POST", 
     url: $(form#ratingsForm).attr('action'), 
     data: {$('form#ratingsForm').serialize(), prodID: prodID}, 
     success: function(response) { 
      alert('Thanks for rating'); 
     }   
     }); 
    }); 
}); 

只要做到這一點在一個函數中初始化並在服務器端發送它們。我希望這可以工作。