Json对象在while循环中断页面时进行字符串检查

Question

Json对象在while循环中断页面时进行字符串检查

Jac*_*ins 1 javascript jquery json while-loop

我有一个网页,从网址获取一个json对象,然后它将json对象转换为一个字符串.如果字符串为真,我希望div淡出,如果它是假的,我希望它保持不变.

来自url的json对象是:{"description":"Input 1","type":"no","enabled":true,"alarm":false}

启用警报时,alarm = true.但我需要不断检查警报是真还是假,所以我需要一个while循环或其他方法来不断检查url的json对象.

出于某种原因,我在下面的代码中使用的方法使页面中断.

当我取出while循环时,它完美地工作,但我必须刷新浏览器以重新检查警报对象.

<html>
<head>
    <link rel="stylesheet" type="text/css" href="style.css">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" crossorigin="anonymous"></script>
       <script>
        $(document).ready(function () {
            var data;
            var r = true;
            do {


                $.ajax({
                    dataType: "json",
                    url: 'http://192.168.1.6/inputs/alarm.cgi',
                    data: data,
                    success: function (response) {
                        // begin accessing JSON data here
                        console.log(response.alarm);
                        var j = (JSON.stringify(response.alarm));
                        console.log(j);
                        if (j == 'true') {
                            $('div').fadeOut('slow');
                        }
                    }
                });
            } while (r == true);
        });
    </script>
</head>
<body>

    <div></div>


</body>
</html>

Run Code Online (Sandbox Code Playgroud)

CSS代码

 div {
        height: 100px;
        width: 100px;
        background-color: #FA6900;
        border-radius: 5px;
    }

Run Code Online (Sandbox Code Playgroud)

Answer 1

bob*_*bob 5

由于发出ajax请求的异步性,你需要将"循环"变成"链".

换句话说,在发出另一个ajax请求之前,您必须等待第一个ajax请求的结果.

var data;
var r = true;

function next(){
    $.ajax({
        dataType: "json",
        url: 'http://192.168.1.6/inputs/alarm.cgi',
        data: data,
        success: successful
    });
}

function successful (response) {
    // begin accessing JSON data here
    console.log(response.alarm);
    var j = (JSON.stringify(response.alarm));
    console.log(j);
    if (j == 'true') {
        $('div').fadeOut('slow');
    }

    // loop... assume some other logic controls "r".
    // Otherwise this will be an infinite loop
    // throttled by setTimeout.
    if(r == true ){
        // Delay calling next
        setTimeout(next, 5000); // execute next in 5000ms (5 sec)
    }
}


$(document).ready(next);

Run Code Online (Sandbox Code Playgroud)

您可能会注意到,如果他们希望在重复之间有一些延迟,他们可以在调用next()的时候调用setTimeout (2认同)

归档时间：	7 年，10 月前
查看次数：	70 次
最近记录：	7 年，10 月前