[英]Html5 Jquery Update labels several time on click event
That I try to do : Click on a button, sleep, change the label to "Run", sleep , change the label "OK" 我尝试做的事情:单击一个按钮,睡眠,将标签更改为“运行”,睡眠,将标签更改为“确定”
I have a button ( #runajax) with click event function. 我有一个带有单击事件功能的按钮(#runajax)。 I have a table with label: 我有一张带有标签的表:
<table class="table table-bordered">
<tbody>
<tr>
<td >Status Global </td>
<td align="center"><label id="Status">FieldToUpdate</label></td>
</tr>
</tbody>
</table>
Javascript : Javascript:
function setStatusRun(runType )
{
$("#Status" + runType).text("running....");
}
function setStatusOK(runType )
{
$("#Status" + runType).text("OK");
}
$(document).ready(function () {
// initialize the viewer
$('#runajax').click(function (event) {
resetStatus();
setStatusRun("");
sleep(3000);
setStatusOK("");
sleep(3000);
event.preventDefault();
});
});
But I can see only the final update, not the intermediate value of the label. 但是我只能看到最终的更新,看不到标签的中间值。
Someone can help me ? 有人可以帮助我吗?
I have done some research around and figure out using setTimeout is a better way than sleep 我已经进行了一些研究,发现使用setTimeout是比睡眠更好的方法
setTimeout(function(), delay)
This is my code on fiddle: 这是我的小提琴代码:
http://jsfiddle.net/mankinchi/0nubjp88/ http://jsfiddle.net/mankinchi/0nubjp88/
I have tried this at first: 我最初尝试过此方法:
setTimeout(function() {
setStatus("run");
},3000);
setTimeout(function() {
setStatus("stop");
},3000);
but got the same problem as you have: showing the last one, not the middle). 但遇到的问题与您相同:显示最后一个,而不显示中间)。
I have some rough time trying to understand the reason why. 我有一些艰难的时间试图理解原因。 Then I change the later one to 6000 and I got the result. 然后我将后面的一个更改为6000,然后得到了结果。 I believe both of the setTimeout run async (doesn't wait for the code to complete to do others). 我相信两个setTimeout都异步运行(不必等待代码完成以完成其他任务)。 Have a look here for more details: 在这里查看更多详细信息:
Asynchronous vs synchronous execution, what does it really mean? 异步与同步执行的真正含义是什么?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.