javascript-ajax獲取數據(php+mysql)

1、使用ajax請求數據

/*
 * $.Ajax()
 */
(function(o){
    o.$ = {
        "Ajax":function(obj){

            var http = null;
            var url = obj.url;
            var oBox = document.querySelector(".box");
            var pData = obj.data?obj.data:null;

            function objToString(obj){

                if(obj){
                    var str = '';
                    for(var i in obj){
                        str += i + "=" +obj[i] +"&";
                    }
                    return str;
                }else{
                    return null;
                }
                
            }

            function createHttp(){
                if(window.XMLHttpRequest){
                    http = new XMLHttpRequest();
                }else{
                    http = new ActiveXObject("Microsoft.XMLHTTP");
                }
            }
            createHttp();

            http.onreadystatechange = function(){

                if(http.readyState == 4 && http.status == 200){
                    var data = JSON.parse(http.responseText);
                    if(data.length){
                        obj.success(data);
                    }else{
                        console.warn("請求數據不存在！");
                    }    
                }


            };

            http.open(obj.type,url,true);
            http.setRequestHeader("Content-Type", "application/x-www-form-urlencoded; charset=UTF-8"); 
            http.send(objToString(pData));
        }
    };
})(window);


//采用Method GET
$.Ajax({
    url:"/ajaxGET.php?typeid=2&flag=h",
    type:"GET",
    success:function(data){
        console.log("GET");
        for(var i in data){
            console.log(data[i]);                
        }
    }
});

//采用Method POST
$.Ajax({
    url:"/ajaxPOST.php",
    type:"POST",
    data:{typeid:1,flag:"h"},
    success:function(data){
        console.log("POST");
        for(var i in data){
            console.log(data[i]);                
        }
    }
});

 

后端PHP輸出數據(GET方式)：

<?php
/*
* 配置連接數據庫信息
*/
$host='localhost';//主機
$user='root';//數據庫賬號
$password='';//數據庫密碼
$database='dedecmsv57utf8sp1';//數據庫名
$tid=$_GET["typeid"];
$flag=$_GET["flag"];

//打開數據庫連接
$db=mysqli_connect($host,$user,$password,$database);
//判斷連接是否成功
if($db){
        $db->query("set names utf8");//設置UTF-8編碼(JSON的唯一編碼)
}else{
        echo 'DATABASE_CONNECTION_DIE';//數據庫連接失敗
        exit;
}
//sql查詢語句
$sql="select * from dede_archives where typeid=".$tid." and flag='".$flag."'";

$result=mysqli_query($db,$sql);
$person_info = array();
while($row=mysqli_fetch_assoc($result)){
     $person_info[]=$row;//將取得的所有數據賦值給person_info數組
}
echo json_encode($person_info);//輸出JSON

?>

后端輸出數據(POST 方式)：

<?php
/*
* 配置連接數據庫信息
*/
$host='localhost';//主機
$user='root';//數據庫賬號
$password='';//數據庫密碼
$database='dedecmsv57utf8sp1';//數據庫名
$tid=$_POST["typeid"];
$flag=$_POST["flag"];

//打開數據庫連接
$db=mysqli_connect($host,$user,$password,$database);
//判斷連接是否成功
if($db){
        $db->query("set names utf8");//設置UTF-8編碼(JSON的唯一編碼)
}else{
        echo 'DATABASE_CONNECTION_DIE';//數據庫連接失敗
        exit;
}
//sql查詢語句
$sql="select * from dede_archives where typeid=".$tid." and flag='".$flag."'";

$result=mysqli_query($db,$sql);
$person_info = array();
while($row=mysqli_fetch_assoc($result)){
     $person_info[]=$row;//將取得的所有數據賦值給person_info數組
}
echo json_encode($person_info);//輸出JSON

?>

 

2、使用JONSP跨域請求

function callback(str){

    for(var i in str){
        console.log(str[i]['title']);
    }

}

需要修改PHP輸出樣式:

<?php
/*
* 配置連接數據庫信息
*/
$host='localhost';//主機
$user='root';//數據庫賬號
$password='';//數據庫密碼
$database='dedecmsv57utf8sp1';//數據庫名


//打開數據庫連接
$db=mysqli_connect($host,$user,$password,$database);
//判斷連接是否成功
if($db){
        $db->query("set names utf8");//設置UTF-8編碼(JSON的唯一編碼)
}else{
        echo 'DATABASE_CONNECTION_DIE';//數據庫連接失敗
        exit;
}
//sql查詢語句
$sql="select * from dede_archives where typeid=1";

$result=mysqli_query($db,$sql);
$person_info = array();
while($row=mysqli_fetch_assoc($result)){
     $person_info[]=$row;//將取得的所有數據賦值給person_info數組
}
echo "callback(".json_encode($person_info).")"; //輸出JSON 

最后一行輸出 添加回調函數 echo "callback(".  . ")";