Jquery AJAX检索PHP变量

时间:2014-08-13 14:34:58

标签: javascript php jquery ajax

我有一个PHP脚本,使我的页面加载缓慢,因为它从另一个站点获取API数据并解析它,所以我想让它最后加载。我正在阅读AJAX,因为它是异步的。下面是我到目前为止的AJAX代码。我现在要做的就是让AJAX从PHP中获取一个变量并显示它,但我无法让它工作。我觉得我真的很接近。

这是我希望它加载到的DIV和脚本触发器。

<div id="results"></div>
<script type="text/javascript">ajax_lastcount();</script>

这是AJAX脚本

<script type="text/javascript">
function ajax_lastcount() {
var hr = new XMLHttpRequest();
hr.open("GET", "/viewcount.php", true);
hr.setRequestHeader("Content-type", "application/json", true);
hr.onreadystatechange = function() {
   if(hr.readyState == 4 && hr.status == 200) {
       var data = JSON.parse(hr.responseText);
       var results = document.getElementById("results");
       results.innerHTML = data;

       }
       }
     }
     hr.send(null);
     results.innerHTML = "requesting...";
}
</script>

这是viewcount.php页面

header("Content-type", "application/json");
$lastcount = "ten";
echo json_encode($lastcount);

1 个答案:

答案 0 :(得分:3)

使用jQuery可以通过此代码实现(在加载页面的DOM之后自动调用):

$(document).ready(function() {
    $.ajax({
        url: '/viewcount.php',
        type: 'get',
        dataType: 'json',
    })
    .success(function(data) {
        $('div#results').html(data);
    });
});

如果您要执行简化的GETPOST请求,您也可以改为:

$(document).ready(function() {
    $.get('/viewcount.php', {'optional_params_object':'value'})
    .success(function(data) {
        $('div#results').html(data);
    });
});

$(document).ready(function() {
    $.post('/viewcount.php', {'optional_params_object':'value'})
    .success(function(data) {
        $('div#results').html(data);
    });
});