評等結果
點擊便能為這篇文章進行評等！
[評等總次數: 1，平均評等: 5]
AJAX 基本格式
$.ajax({
type : 'POST', // 參數傳送方式
url : 'test.php', // 執行頁面
data : { key:value,key:value}, // 傳送資料
dataType : 'json',// 返回格式(xml/html/script/json/jsonp/text)
success : function(data) { // 執行成功後執行此函式
//假設回傳的json 格式為{"status":"fail","error_msg","找不到相關資料"}
if(data.status=='fail'){alert(data.error_msg);}//若狀態為失敗 就輸出錯誤訊息
else{dosomething...}//
}
}).fail(function() {alert('錯誤');});//執行失敗時執行此函式實際範例：
點我開始範例
ajax_demo_form.html
表單輸入姓名，選擇姓別後透過ajax的方式去呼叫 show.php
show.php中會接到 姓名與姓別(當姓別為男時回傳 先生 /女 回傳 小姐)
在 ajax_demo_form.html 以alert的方式秀出 xxx 先生 你好！
ajax_demo_form.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>ajax 基礎範例</title>
</head>
<body>
姓名：<input id="name" name="name" type="text">
姓別：<select id="sex" name="sex">
<option value='m'>男</option>
<option value='f'>女</option>
</select>
<button type="button" id="send" class="btn btn-primary btn-lg" >送出</button>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function() {
$('#send').click(function(){
if($('#name').val()==''){alert('姓名不可為空');}else{show();}
});
});
function show(){
$.ajax({
type : 'POST', // 修改串接方式
url : 'show.php', // 修改串接頁面
data : {name:$('#name').val(),sex:$('#sex').val()}, // 修改傳送資料
dataType : 'json',
success : function(data1) { //回傳值帶入
alert(data1.name+' '+data1.sex+' 你好！' );
}
}).fail(function (jqXHR, textStatus, msg) {alert(msg);});
}
</script>
</body>
</html>show.php
<?php
$name=$_POST['name'];
$sex=$_POST['sex'];
$arr=array();
$arr['name']=$name;//以 陣列 鍵/值 的方式儲存
$arr['sex']=($sex=='m'?'先生':'小姐');//將姓別轉換成相對應的 稱謂
echo json_encode($arr);
?>評等結果
點擊便能為這篇文章進行評等！
[評等總次數: 1，平均評等: 5]