如何添加一個ajax提交功能到一個表格

我認爲這會工作，也許我錯過了什麼？我能做些什麼來調用javascropt提交事件？如何添加一個ajax提交功能到一個表格

感謝，

約翰

<html> 
<body> 
<form name='myForm' action='formprocess.php' method='get'> 
Name: <input type='text' onChange="ajaxFunction();" name='username' /> <br /> 
Time: <input type='text' name='time' /> 
</form> 
<script type="text/javascript"> 
    var frm = $('myform'); 
    frm.submit(function() { 
     $.ajax({ 
      type: frm.attr('method'), 
      url: frm.attr('action'), 
      data: frm.serialize(), 
      success: function (data) { 
       alert('ok'); 
      } 
     }); 

     return preventDefault(); 
    }); 
</script> 
<div id="box"> </div> 
</body>

來源

2013-07-30 John Kerry

的onChange的函數調用是由一塊代碼的形式之前（完美的作品） –

上的onchange'ajaxFunction（）'調用提交事件？ 'ajaxFunction（）'的實現在哪裏，你什麼時候調用'submit（）'？ – rps

第一個問題是name='myForm'。名稱屬性（控件（如<input>）除外）已過時。改爲使用id屬性。

id="myForm"

第二個問題是$('myform');將選擇<myform>元件。使用#myForm通過其ID選擇一個元素。第二個問題是return preventDefault();。

preventDefault是一個方法的事件對象，不是全局的，不應該返回。

您需要捕獲事件對象（這是第一個參數的函數），並調用其方法：

frm.submit(function (evt) { 
    … 
    evt.preventDefault(); 
});

四（帽尖到天向T.），你需要一個提交按鈕在提交表單之前。

來源

2013-07-30 06:23:18 Quentin

感謝您的幫助，進行編輯，我會讓你知道:) –

.submit()不提交表單，而是向onsubmit事件添加事件處理程序。你仍然需要一個提交按鈕。這是未經測試，但應該工作：

<form id="myForm" action='formprocess.php' method='get'> 
    Name: <input type='text' onChange="ajaxFunction();" name='username' /> <br /> 
    Time: <input type='text' name='time' /> 
    <button type="submit">Send</button> 
</form> 
<script> 
    $(function(){ 
     $('#myform').on('submit', function (e) { 

      e.preventDefault(); 

      $.get(
       $(this).attr('action'), 
       $(this).serialize(), 
       function (response, status, jqxhr) { 
        alert('ok'); 
       } 
      }); 

     }); 
    }); 
</script>

來源

2013-07-30 06:29:19

如何添加一個ajax提交功能到一個表格

回答

相關問題