AJAX表單submisson

我正在爲遊戲服務器賣家編碼CMS，但遇到了問題。我有以下代碼：AJAX表單submisson

<div id="ServerResponse" align="center"></div> 
<form id="RegistrationForm" method="post" action="/account.php?do=create"> 
    <input type='text' placeholder='{#Name#}' id='Name' name="Name" autocomplete="off"> 
    <input type='text' placeholder='{#Surname#}' id='Surname' name="Surname" autocomplete="off"><br /> 
    <select name="day" id="day" style='width: 55px;'> 
    <option value="1">1</option> 
    <option value="2">2</option> 
    <option value="3">3</option> 
    <option value="4">4</option> 
    <option value="5">5</option> 
    <option value="6">6</option> 
    <option value="7">7</option> 
    <option value="8">8</option> 
    <option value="9">9</option> 
    <option value="10">10</option> 
    <option value="11">11</option> 
    <option value="12">12</option> 
    <option value="13">13</option> 
    <option value="14">14</option> 
    <option value="15">15</option> 
    <option value="16">16</option> 
    <option value="17">17</option> 
    <option value="18">18</option> 
    <option value="19">19</option> 
    <option value="20">20</option> 
    <option value="21">21</option> 
    <option value="22">22</option> 
    <option value="23">23</option> 
    <option value="24">24</option> 
    <option value="25">25</option> 
    <option value="26">26</option> 
    <option value="27">27</option> 
    <option value="28">28</option> 
    <option value="29">29</option> 
    <option value="30">30</option> 
    <option value="31">31</option> 
    </select> 

    <select name="month" id="month" style='width: 90px;'> 
    <option value="January">January</option> 
    <option value="February">February</option> 
    <option value="March">March</option> 
    <option value="April">April</option> 
    <option value="May">May</option> 
    <option value="June">June</option> 
    <option value="July">July</option> 
    <option value="August">August</option> 
    <option value="September">September</option> 
    <option value="October">October</option> 
    <option value="November">November</option> 
    <option value="December">December</option> 
    </select> 

    <select name="year" id="year" style='width: 70px;'> 
    <option value="1950">1950</option> 
    <option value="1951">1951</option> 
    <option value="1952">1952</option> 
    <option value="1953">1953</option> 
    <option value="1954">1954</option> 
    <option value="1955">1955</option> 
    <option value="1956">1956</option> 
    <option value="1957">1957</option> 
    <option value="1958">1958</option> 
    <option value="1959">1959</option> 
    <option value="1960">1960</option> 
    <option value="1961">1961</option> 
    <option value="1962">1962</option> 
    <option value="1963">1963</option> 
    <option value="1964">1964</option> 
    <option value="1965">1965</option> 
    <option value="1966">1966</option> 
    <option value="1967">1967</option> 
    <option value="1968">1968</option> 
    <option value="1969">1969</option> 
    <option value="1970">1970</option> 
    <option value="1971">1971</option> 
    <option value="1972">1972</option> 
    <option value="1973">1973</option> 
    <option value="1974">1974</option> 
    <option value="1975">1975</option> 
    <option value="1976">1976</option> 
    <option value="1977">1977</option> 
    <option value="1978">1978</option> 
    <option value="1979">1979</option> 
    <option value="1980">1980</option> 
    <option value="1981">1981</option> 
    <option value="1982">1982</option> 
    <option value="1983">1983</option> 
    <option value="1984">1984</option> 
    <option value="1985">1985</option> 
    <option value="1986">1986</option> 
    <option value="1987">1987</option> 
    <option value="1988">1988</option> 
    <option value="1989">1989</option> 
    <option value="1990">1990</option> 
    <option value="1991">1991</option> 
    <option value="1992">1992</option> 
    <option value="1993">1993</option> 
    <option value="1994">1994</option> 
    <option value="1995">1995</option> 
    <option value="1996">1996</option> 
    <option value="1997">1997</option> 
    <option value="1998">1998</option> 
    <option value="1999">1999</option> 
    <option value="2000">2000</option> 
    <option value="2001">2001</option> 
    <option value="2002">2002</option> 
    <option value="2003">2003</option> 
    <option value="2004">2004</option> 
    <option value="2005">2005</option> 
    <option value="2006">2006</option> 
    <option value="2007">2007</option> 
    <option value="2008">2008</option> 
    <option value="2009">2009</option> 
    <option value="2010">2010</option> 
    <option value="2011">2011</option> 
    <option value="2012">2012</option> 
    <option value="2013">2013</option> 
    <option value="2014">2014</option> 
    </select> 

    </br> 

    <input type='text' placeholder='{#Username#}' id='Username' name="Username" autocomplete="off"><br /> 
    <input type='password' placeholder='{#Password#}' id='Password' name="Password" autocomplete="off"><br /> 
    <input type='password' placeholder='{#RPassword#}' id='RPassword' name="RPassword" autocomplete="off"><br /> 
    <input type='text' placeholder='EMail' id='Email' name="Email" autocomplete="off"><br /> 
    <input type='submit' value='{#Registration#}'> <input type="reset" value="{#ResetF#}"><br /> 
</form> 

</center>

的事情是，我不能讓這個形式通過AJAX發表後的數據，它只是打開account.php?do=create頁。

你能幫我解決這個問題嗎？

喜歡的jquery.js所有的JS，jquery.form.js包括

我使用這個代碼做AJAX的東西：

<script type="text/javascript"> 
    $(document).ready(function(){ 
    var options = { 
     target: "#ServerResponse", 
     timeout: 3000 
    }; 

    $('#RegistrationForm').submit(function() { 
     $(this).ajaxSubmit(options); 
     return false; 
    }); 
    }); 
</script>

而且我使用Smarty的，並且代碼中提到以上是{literal}{/literal}的標籤。

來源

2014-01-28 Ivan Zhivolupov

控制檯中的錯誤？ domready中？ – dfsq

完全沒有錯誤，是的，準備好 –

'e.preventDefault（）'緊跟在$（'#RegistrationForm'）之後。submit（function（）{'也許？ –

Submit在窗體上是一個event並取消提交事件的默認操作，您需要使用event.preventDefault();。 See Here

的preventDefault

如果事件可取消，所述的preventDefault方法用於表示該事件要被取消，這意味着通常所採取的實現作爲所述事件的結果的任何默認動作將不會發生。在事件流的任何階段，如果調用preventDefault方法，則事件被取消。與相關的任何默認操作都不會發生。將此方法調用爲不可取消的事件不起作用。一旦調用了preventDefault，它將在整個事件傳播的剩餘時間內保持有效。此方法可用於事件流程的任何階段。

也許試試你的ajax這種方式。

$('#RegistrationForm').submit(function(e) { 
e.preventDefault(); 
var postData = $(this).serialize(); 
var formURL = $(this).attr("action"); 
$.ajax({ 
    type: "POST", 
    url: formURL, 
    timeout: 3000, 
    data: postData, 
    success: function(response){ 
     $("#ServerResponse").html(response); 
    }   
    }); 
});

來源

2014-01-28 15:40:48

Thx，但是sinse im使用smarty和html5，我只是對每個表單字段應用了必需的標籤，也創建了錯誤頁面，看起來不錯。無論如何，Thx 4你的幫助 –

嘗試添加到您的表單元素onsubmit="return false"

如果不解決它，而是它只是什麼都不做，然後使它onsubmit="functionName();return false"

或者自己添加事件處理程序的表單元素，如果你特別關注不使用JavaScript屬性。

來源

2014-01-28 11:24:12 David

嘗試過，仍然是同樣的事情，它只是忽略js，不知道爲什麼 –

嘗試用＃替換動作值，看看是否修復它。這在多個瀏覽器中，並清除您的緩存？ – David

試圖在IE10中，Safari（最新），Chrome（最新），Firefox（最新） - 給出了相同的結果，只需點擊提交按鈕後重定向到提到的頁面。瀏覽器緩存被禁用，服務器端緩存也被禁用 –

回答

相關問題