使用JQUERY使用JSON数据刷新div

时间:2014-10-22 21:50:42

标签: javascript jquery json

我知道这是一个重复的问题,但我无法使用我的特定代码。

我有一个JSON文件,其中包含2个变量,我想在页面上每隔5秒显示一次。它工作得很好,但是一旦我尝试插入setTimeout或setInterval,数据就不会显示。

<script>   
    $(document).ready(function() {  
        (function request() {
            $.ajax({
                url: "json.account-balance.php",
                dataType: "text",
                cache: false,
                success: function(data) {
                    var json = $.parseJSON(data);
                    $('#trade_pp').html(json.trade);
                    $('#ect_pp').html(json.ect);
                }             
            });              
       setTimeout(request, 5000);
         });
    });
</script>

2 个答案:

答案 0 :(得分:2)

感谢。这完美地运作

<script>   
    $(document).ready(function() {
        function updateDiv(){
            $.ajax({
                url: "json.account-balance.php",
                dataType: "json",
                cache: false,
                success: function(data) {
                    $('#trade_pp').html(data.trade);
                    $('#ect_pp').html(data.ect);
                }             
            });              
        }
        updateDiv();
        setInterval(updateDiv, 5000);
    });
</script>

答案 1 :(得分:1)

不需要自动执行功能:

$(document).ready(function() {  
    function request() {
        $.ajax({
            url: "json.account-balance.php",
            dataType: "text",
            cache: false,
            success: function(data) {
                var json = $.parseJSON(data);
                $('#trade_pp').html(json.trade);
                $('#ect_pp').html(json.ect);
            }             
        });              
    }

    setTimeout(request, 5000);
});

此外,您的dataType可能是JSON - 设置此选项会自动为您解析数据。无需$.parseJSON

$.ajax({
        url: "json.account-balance.php",
        dataType: "json",
        cache: false,
        success: function(data) {
            //var json = $.parseJSON(data);
            $('#trade_pp').html(data.trade);
            $('#ect_pp').html(data.ect);
        }             
    });