同步函数运行时显示一个视觉指示器

我有一个叫做compute()的函数，它执行一堆计算，然后更新由click()事件触发的HTML表的值。这不是一个阿贾克斯调用，只有几个for循环。同步函数运行时显示一个视觉指示器

我想要做的是提供一个计算运行的视觉指示器。就像修改表格的不透明度一样。我认为，像下面这样可以工作：

$("#mytable").css("opacity", "0.5"); 
compute(); 
$("#mytable").css("opacity", "1");

但是，当我使用此代码似乎不透明度不进行修改。

任何提示如何做到这一点？

非常感谢提前！

来源

2012-11-23 juba

你试过'$（ “＃MYTABLE”）的CSS（ “不透明度”，0.5）;'？只是猜测反正... – renatoargh

你有没有尝试在计算结束时恢复不透明度？ – sourRaspberri

你使用什么浏览器？ – Magus

这是因为UI在不透明度的修改和compute();函数之间没有更新。用户界面会更新一次，而不是每行代码之后（这会减慢一切）。

您可以使用超时来绕过：setTimeout(compute, 0);。

这样你的用户界面在运行前得到更新compute()。您必须将第三行放在该函数中，将不透明度修改为1，因为它将在compute()完成之前运行。

$("#mytable").css("opacity", "0.5"); 
setTimeout(compute, 0); 

function compute() { 
    ... 

    $("#mytable").css("opacity", "1"); 
}

它可能看起来很脏，但它确实是一种确保你的UI更新的真正方法！

来源

2012-11-23 14:58:09

啊，是的，这是有效的！事实上，我已经尝试过这样的事情，但我留下了括号：'setTimeout（compute（），0）;'这不起作用。非常感谢！ – juba

非常欢迎@juba。 setTimeout和setInterval方法需要一个函数。您可以设置一个内联函数：'的setTimeout（函数（）{/ *做的东西* /}，1000）;'或使用功能名称：'的setTimeout（函数名，1000）;'。如果添加括号，则无论函数返回什么参数都将被设置。 –

只是为了澄清为什么这不起作用，如果你让括号：http://stackoverflow.com/questions/8058996/why-does-calling-settimeout-with-parenthesis-not-start-a-new-callstack – juba

JavaScript的所有客户端实现都是单线程的，所以在执行下一条语句时，您无法真正期望函数调用compute继续运行。
但是，如果您希望可以使用web worker来排序后台线程。

阅读您的问题第二次之后，我必须说，@tomdemuyt很可能是正确的：这很可能是compute如此之快，不透明度在拆分更换两次第二，如此之快，你几乎察觉不到执行改变。此外，由于这是一个事件处理程序，你可能要考虑这个问题：

function compute(e) 
{ 
    $(this).css({opacity:'.5'}); 
    //rest of your code 
    $(this).css({opacity:'1'}); 
} 
$('#mytable').on('click',compute);

这样更整齐只是有点IMO - 这可能是因为这并不适用于你的代码，但以防万一..

来源

2012-11-23 14:57:46

这很可能是因为您的compute（）函数执行得太快以至于您无法感知不透明度更改。

尝试在compute（）中放置一个断点，让我们知道不透明度是否发生了变化。

来源

2012-11-23 14:57:46 tomdemuyt

同步函数运行时显示一个视觉指示器

回答

相关问题