jquery，AJAX表單提交不起作用。頁面崩潰

我想獲取提交表單而不重新加載頁面。jquery，AJAX表單提交不起作用。頁面崩潰

這裏的腳本：

$(function() { 
    $("#submit").click(function() { 
     var email = document.getElementById('emailaddress'); 
     var filter = /^([a-zA-Z0-9_\.\-])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/; 
     if (!filter.test(email.value)) { 
      $('#invalidmail').show(); 
      var t=setTimeout(function(){$('#invalidmail').fadeOut("slow");},2000); 
      email.focus; 
      return false; 
     } else {  
      $.ajax({ 
       type: "POST", 
       url: "traces_form_handler.cgi", 
       data: email, 
       success: function(){ 
        alert("success!"); 
       } 
      }); 
      alert("success!"); 
      return false; 
     }; 

     }); 
}); 
</script>

和這裏的HTML

<form name="form" method="post"> 
    Email: <input type="text" name="email" id="emailaddress" /> 
    <input type="submit" value="Submit" id="submit"/> 
    </form>   
    <p id="invalidmail">Ops! The address you provided is not valid. Please retry.</p>

它的工作原理，直到無效郵件的一部分，但如果我提出一個有效的電子郵件地址，瀏覽器崩潰。

有什麼建議嗎？

謝謝

來源

2012-03-16 lorussian

您需要防止默認提交表單的行動。您正在發送AJAX請求*和*同時提交表單。 – 2012-03-16 17:43:17

您還嘗試過哪些瀏覽器？ – Lix 2012-03-16 17:44:20

@Diodeus不是'返回false';'呢？ Lix chrome！ – lorussian 2012-03-16 17:46:14

我不知道是否會導致瀏覽器崩潰。但是你正在發送一個dom元素作爲數據到ajax請求，我猜你只想發送它的值。

 $.ajax({ 
      type: "POST", 
      url: "traces_form_handler.cgi", 
      data: { email: email.value },//Check here in your code 
      success: function(){ 
       alert("success!"); 
      } 
     });

來源

2012-03-16 17:51:59 ShankarSangoli

這實際上工作！ – lorussian 2012-03-16 18:07:45

這個屬性是導致問題

url: "traces_form_handler.cgi",

我有它在我的瀏覽器FF 10.0.2

上的錯誤控制檯錯誤測試是：錯誤：未捕獲的異常：異常.. 「無法轉換JavaScript參數」nsresult：「0x80570009（NS_ERROR_XPC_BAD_CONVERT_JS）:: line 7601」data：no]

Solution: url:"some_valid_url_.php"

來源

2012-03-16 17:52:46 Rizvi

我不能將它發送給python腳本嗎？ – lorussian 2012-03-16 18:08:30

您可以使用表單提交的事件，它; S更好

HTML

<form id="myForm" name="form" method="post"> 
    Email: <input type="text" name="email" id="emailaddress" /> 
    <input type="submit" value="Submit" id="submit"/> 
</form> 
<p id="invalidmail">Ops! The address you provided is not valid. Please retry.</p>

$(function() { 
$("#myForm").on('submit', function(e){ 
e.preventDefault(); 
var email=$("#emailaddress"); 
var filter = /^\[email protected][a-zA-Z_]+?\.[a-zA-Z]{2,3}$/; 
    if (!filter.test(email.value)) { 
     $('#invalidmail').show(); 
     var t=setTimeout(function(){ 
      $('#invalidmail').fadeOut("slow");},2000); 
     email.focus; 
     return false; 
    } 
    else 
    {  
     $.ajax({ 
      type: "POST", 
      url: "my_server-page.php", 
      data: email.val(), 
      success: function(data){ 
       alert("success!"); 
      } 
     }); 
    } 

}); 
});

來源

2012-03-16 17:53:25

jquery，AJAX表單提交不起作用。頁面崩潰

回答

相關問題