jquery ajax+php實(shí)現(xiàn)簡單交互

由于平時要與ajax打交道,所以選擇了簡單基礎(chǔ)的jquery的ajax方法來完成我的相關(guān)需求,這里只是很簡單的做一個演示來促進(jìn)自己對ajax與php實(shí)行交互的一些理解。
1.首先寫一個ajax方法常見的格式:

$.ajax({

    type: 'POST',
    url: url ,
    data: data ,
    success: success ,
    dataType: dataType

});

2.簡單的對ajax方法的參數(shù)進(jìn)行一些描述

url (必需)規(guī)定把請求發(fā)送到哪個URL。

data 可選。映射或字符串值。規(guī)定連同請求發(fā)送到服務(wù)器的數(shù)據(jù)。

success(data, textStatus, jqXHR) 可選。請求成功時執(zhí)行的回調(diào)函數(shù)。

dataType (可選)規(guī)定預(yù)期的服務(wù)器響應(yīng)的數(shù)據(jù)類型。默認(rèn)執(zhí)行智能判斷(xml、json、script 或 html)。

3.標(biāo)注一個剛剛自己寫的簡單的實(shí)現(xiàn)input標(biāo)簽失去焦點(diǎn)來傳輸給php

        <div>
            <span>NAME:</span><input type="text" id="name"/><br /><br/>
            <span>ADDRESS:</span><input type="text" name="address" onblur="change()" />
        </div>
        <script type="text/javascript">
            function change(item) {
                var txt1 = $("#name").val();
                var txt2 = $("input[name=address]").val();
                $.ajax({
                    type: 'post',
                    url: 'change.php',
                    data: {name: txt1, address: txt2},
                    dataType: 'json',
                    success: function (data) {
                        if (data.status == 0) {
                            alert(data.msg);
                        } else {
                            alert(data.msg);
                        }
                    },
                    error: function () {
                        alert("程序異常");
                    }
                });
            }
        </script>

這樣對于change.php文件就可以接收到傳輸?shù)南嚓P(guān)數(shù)據(jù)來進(jìn)行處理,我非常簡單的寫了一個接收數(shù)據(jù)的php文檔,代碼如下:

<?php
//判斷傳過來的name是否為空來判斷
if(!empty($_POST['name'])){
    $value = array("status"=>"1","msg"=>"保存成功");
    echo json_encode($value);
}
else {
    $value = array("status"=>"0","msg"=>"保存失敗");
    echo json_encode($value);
}

由于我選擇datatype是json格式,所以就通過json_encode函數(shù)進(jìn)行處理返回?cái)?shù)據(jù)。
在網(wǎng)上看到一個ajax注意方式,如下:

1.data主要方式有三種,html拼接的,json數(shù)組,form表單經(jīng)serialize()序列化的;通過dataType指定,不指定智能判斷。

2.$.ajax只提交form以文本方式,如果異步提交包含<file>上傳是傳過不過去,需要使用jquery.form.js的$.ajaxSubmit

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

推薦閱讀更多精彩內(nèi)容