Question

嘿所有人！关于用户显示和javascript的快速问题。我想要做的是关闭更新箭头gif，显示旋转箭头，执行更新，隐藏旋转箭头，最后显示说明此项目已设置的gif。

我的问题是旋转箭头永远不会显示。我把睡眠放在那里是因为我认为更新发生得如此之快以至于我没有看到它，但似乎并非如此。

非常感谢任何帮助。

    function sleep(milliSeconds){
    var startTime = new Date().getTime(); // get the current time
    while (new Date().getTime() < startTime + milliSeconds); // hog cpu
}

function UpdateConfig(some_id) {
    /* loop through all divs of class .changed_dropdown and if visible do something */
    $(".changed_dropdown").each(function(index) {
        if($(this).is(":visible")){ 

            some_id = ($(this).data('some_id'));
            /* turn off the div that shows this is in need of update (uparrow gif) */
            $('#changed'+some_id).toggle(false);
            /* turn on the div that displays the arrows going around in a circle (roundarrow gif) */
            $('#updating'+some_id).toggle(true);

            /* pause to allow the divs to change */
            sleep(500);
            var new_config = $("#" + some_id).val();
            $.post("change_config.php?some_id="+some_id+"&config="+new_config);

            /* turn off the div that displays the arrows going around in a circle (roundarrow gif) */
            $('#updating'+some_id).toggle(false);
            /* turn on the gif that indicates this is the current setting */
            $('#unchanged'+some_id).toggle(true);

        }
    }); 
}

Answer 1

如果您在代码中放置了类似的睡眠功能，那么您的文档DOM不会更新，它只会挂起您的浏览器。它仅在脚本完成当前运行时更新。您必须使用setTimeout和异步操作，并在回调函数中更新文档。

Answer 2

将最后两行放入作为“$ .post（）”处理程序传入的函数中：

     $.post("change_config.php?some_id="+some_id+"&config="+new_config, {}, function() {
       $('#updating'+some_id).toggle(false);
       $('#unchanged'+some_id).toggle(true);
     });

“$ .post（）”启动HTTP请求，但会立即返回。通过推迟第二批切换直到完成，您可以让其他内容发生，包括更新视图。

编辑 - 另一个问题（我很确定）是你以一种非常可疑的方式使用该参数“some_id”。它是“UpdateConfig（）”的参数，但你所做的只是从一个元素上的一些数据中重新分配它。但是因为它在函数顶部的“.each（）”循环中声明了在外部的处理程序，所以每次迭代都会共享它，因此所有那些“$ .post（）”处理程序都会共享它。我不知道为什么它是一个参数，但是只需更改从“.data（）”调用中分配的那一行应该是安全的：

var some_id = ($(this).data('some_id'));

通过用var声明它，你可以使它成为“.each（）”回调的局部变量，因此每个“$ .post（）”处理程序都有自己的副本。

循环中穿过三个分区 - 一些分区不变

2 个答案: