我正在使用jQuery UI .toggleClass（类，[duration]）来切换100x100盒子上的红色背景，但我得到的结果很奇怪。请参阅http://jqueryui.com/docs/toggleClass/以供参考。
正如您在此示例中看到的那样 - http://jsfiddle.net/xkrX9/ - 第一个点击div＃框立即切换红色背景（没有任何[持续时间]）然后再将其切换回大约1秒后没有第二次点击事件的白色。 第二次点击（不重新加载页面）会导致.red类按预期切换，持续时间为1000毫秒。
这里出了什么问题？感谢您的任何见解！
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<style>
#box { width: 100px; height: 100px; border: 1px solid #999; }
.red { background: red; }
</style>
<div id="box"></div>
<script>
$('#box').click(function() {
$(this).toggleClass('red', 1000);
});
</script>