按鈕的Ajax請(qǐng)求時(shí)一次點(diǎn)擊兩次提交的解決方法
頁面中的按鈕的type是submit的: <input type="submit" value="Create" id="submit" />
ajax的請(qǐng)求,在JQuery中是:
$(function () {
$('#submit').click(function () {
var createGenreForm = $('#createGenreForm');
if (createGenreForm.valid()) {
var obj = {
Name: $('#Name').val(),
Description: $('#Description').val()
};
var jsonSerialized = JSON.stringify(obj);
$.ajax({
type: "POST",
url: createGenreForm.attr('action'),
dataType: "json",
contentType: "application/json; charset=utf-8",
data: jsonSerialized,
success: function (result) {
alert(result.Message);
},
error: function (error) {
alert("There was an error posting the data to the server: " + error.responseText);
}
});
}
});
});
發(fā)生兩次提交的原因是在執(zhí)行完ajax請(qǐng)求后,并沒有阻止submit的行為,所以解決方法有兩種:
1、不使用type為submit類型的按鈕,而是使用type是button的按鈕。
2、在$('#submit').click函數(shù)中,最后加一行return false;,即可阻止submit。
一點(diǎn)說明:為什么在標(biāo)題中要嵌入英文?原因是為了能夠讓國(guó)外的網(wǎng)友能查詢到這篇文章。平常在Google上查資料的時(shí)候,經(jīng)常參考國(guó)外網(wǎng)友的博客,幫助我解決了很多問題,所以我也想讓他們能夠參考我寫的內(nèi)容。當(dāng)然文中我不可能全部譯為英文,所以我盡量把代碼粘全,靠代碼說話吧。
以上所述是小編給大家介紹的按鈕的Ajax請(qǐng)求時(shí)一次點(diǎn)擊兩次提交的解決方法,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!
相關(guān)文章
用ajax xml的數(shù)據(jù)讀取的HelloWorld程序
我們經(jīng)常會(huì)使用JavaScript實(shí)現(xiàn)動(dòng)態(tài)的改變div里面的內(nèi)容,尤其是使用ajax的時(shí)候,尤為重要。2009-04-04
AJAX 動(dòng)態(tài)獲取當(dāng)前時(shí)間(php)
利用AJAX動(dòng)態(tài)獲取當(dāng)前時(shí)間,客戶端time.php,服務(wù)器端time_check.php2009-11-11
jsp+ajax實(shí)現(xiàn)無刷新上傳文件的方法
這篇文章主要介紹了jsp+ajax實(shí)現(xiàn)無刷新上傳文件的方法,結(jié)合實(shí)例形式分析了ajax無刷新上傳文件及jsp后臺(tái)處理的相關(guān)技巧,需要的朋友可以參考下2016-01-01
Ajax?請(qǐng)求隊(duì)列解決方案并結(jié)合elementUi做全局加載狀態(tài)
這篇文章主要介紹了Ajax?請(qǐng)求隊(duì)列解決方案并結(jié)合elementUi做全局加載狀態(tài),使用 消息隊(duì)列 制作 請(qǐng)求防抖,防止重復(fù)請(qǐng)求印象服務(wù)器,本文通過實(shí)例代碼給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-10-10
Jquery Ajax請(qǐng)求方法小結(jié)(值得收藏)
本文給大家介紹jquery ajax請(qǐng)求方法小結(jié),jquery作為一個(gè)輕量級(jí)的js框架,能快速的開發(fā)js應(yīng)用,并且在一定程度上改變了我們寫js代碼的習(xí)慣,對(duì)jquery ajax請(qǐng)求感興趣的朋友參考下2015-11-11
AJAX跨域請(qǐng)求獲取JSON數(shù)據(jù)的實(shí)現(xiàn)方法
我們都知道,由于受到瀏覽器的限制,AJAX?是不允許跨域請(qǐng)求,不過可以通過使用?JSONP?來實(shí)現(xiàn),本文介紹了?JSONP?的是怎么在?jQuery,MooTools?的,Dojo?Toolkit?中實(shí)現(xiàn)的,感興趣的朋友跟隨小編一起看看吧2023-06-06
ajax實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng)效果
這篇文章主要為大家詳細(xì)介紹了ajax動(dòng)態(tài)實(shí)現(xiàn)select三級(jí)聯(lián)動(dòng),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2018-01-01

