Ajax提交表單并接收json實例代碼
需求:
實現(xiàn)點擊按鈕后,數(shù)據(jù)以表單形式提交至服務器,并接收來自服務器的返回數(shù)據(jù)。過程中頁面不刷新。
html代碼
<html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script> <script src="./testajaxjs.js"></script> <head> </head> <body> <form id="form1"> <p>xingming:<input type="text" name="xingming"/></p> <p>nianling:<input type="text" name="nianling"/></p> </form> <button type="button" id="mybt" onclick="mysubmmit()"> ajax提交 </button> </body> </html>
js代碼
function mysubmmit(){
$.ajax({
type: "POST",
url: "testajaxend.php",
data: $('#form1').serialize(),
async: false,
success: function(databack){
//console.log("chenggong");
console.log(databack);
},
error: function(request){
console.log("shibaile");
}
});
}
后端php代碼
<?php
$name = $_POST['xingming'];
$age = $_POST['nianling'];
$myarray = array("name"=>$name, "age"=>$age);
$myjson = json_encode($myarray);
echo $myjson;
?>
以上所述是小編給大家介紹的Ajax提交表單并接收json實例代碼,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!
相關文章
jQuery AJAX中readyState與status的區(qū)別與聯(lián)系
這篇文章主要介紹了 jQuery AJAX中readyState與status的區(qū)別與聯(lián)系,非常不錯,具有參考借鑒價值,需要的朋友可以參考下2017-03-03
使用加載圖片解決在Ajax數(shù)據(jù)加載中頁面出現(xiàn)短暫空白的問題(推薦)
在項目中用ajax異步獲取數(shù)據(jù)后有時會因為數(shù)據(jù)問題或者網(wǎng)絡問題,頁面一直顯示空白,現(xiàn)在用加載圖片來過渡這種狀態(tài),具體實例代碼通過本文一起學習吧2016-12-12
Ajax修改數(shù)據(jù)即時顯示篇實現(xiàn)代碼
上一篇我們講了如何使用ajax向數(shù)據(jù)庫添加數(shù)據(jù),今天我們要大家學習的課程是:使用ajax修改數(shù)據(jù)庫數(shù)據(jù),并在客戶網(wǎng)頁立即顯示新的內(nèi)容.當然在修改的過程中同樣不會有刷新網(wǎng)頁的情況發(fā)生!2010-10-10
滑輪滾動到頁面底部ajax加載數(shù)據(jù)配合jsonp實現(xiàn)探討
滾動下拉到頁面底部加載數(shù)據(jù)是很多瀑布流網(wǎng)站的做法,那來看看配合jsonp是如何實現(xiàn)的吧,小菜總結記錄之用特在此與大家一起分享,感興趣的朋友可以參考下哈2013-05-05
ajax實現(xiàn)點擊不同的鏈接讓返回的內(nèi)容顯示在特定div里
過ajax實現(xiàn)在一個web頁面點擊不同的鏈接,然后將返回的結果顯示在該頁面固定的div里2014-06-06
通過Ajax方式綁定select選項數(shù)據(jù)的實例
今天小編就為大家分享一篇通過Ajax方式綁定select選項數(shù)據(jù)的實例,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2018-08-08

