jQuery:visible在执行隐藏动画时为true
我意识到这就是它的行为方式,但当我试图确定元素在隐藏过程中的可见性时(或者当“:animated”为true时,如果反转显示),就会产生问题 那么,我如何使用jQuery来确定元素是否可见,但要注意的是,当前可见但正在隐藏自己的元素被认为是隐藏的(不是当前行为),而正在显示自己的元素继续被认为是可见的(当前行为) 由于:visible的检查发生在jQuery事件中,因此从元素显示/隐藏的位置到需要进行可见性检查的位置没有直接的代码路径,因此问题变得更糟。因此,我不能仅仅通过中间的所有函数传递动画状态 下面是一些代码来说明这个问题:jQuery:visible在执行隐藏动画时为true,jquery,jquery-selectors,jquery-animate,jquery-1.4,Jquery,Jquery Selectors,Jquery Animate,Jquery 1.4,我意识到这就是它的行为方式,但当我试图确定元素在隐藏过程中的可见性时(或者当“:animated”为true时,如果反转显示),就会产生问题 那么,我如何使用jQuery来确定元素是否可见,但要注意的是,当前可见但正在隐藏自己的元素被认为是隐藏的(不是当前行为),而正在显示自己的元素继续被认为是可见的(当前行为) 由于:visible的检查发生在jQuery事件中,因此从元素显示/隐藏的位置到需要进行可见性检查的位置没有直接的代码路径,因此问题变得更糟。因此,我不能仅仅通过中间的所有函数传递动画
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
var spn, result1, result2, lastDelayedResult, lastResetResults;
$(document).ready(function() {
spn = $('#spn');
result1 = $('#result1');
result2 = $('#result2');
});
function toggle() {
clearTimeout(lastDelayedResult);
clearTimeout(lastResetResults);
result2.text("");
spn.slideToggle();
result1.text("The text is " + visibility() + ". ");
lastDelayedResult = setTimeout(function(){delayedResult();}, 1000);
lastResetResults = setTimeout(function(){resetResults();}, 3000);
}
function visibility() {
return (spn.is(':visible')) ? "visible" : "hidden";
}
function delayedResult() {
result2.text("After a second the text is " + visibility() + ".");
}
function resetResults() {
result1.text("");
result2.text("");
}
</script>
</head>
<body>
<span id="result1"></span>
<span id="result2"></span>
<hr/>
<input id="btn" name="btn" type="button" onclick="toggle();" value="Click Me!"/><br/>
<span id="spn">I am the text!</span>
</body>
</html>
变量spn、结果1、结果2、lastDelayedResult、lastResetResults;
$(文档).ready(函数(){
spn=$(#spn');
结果1=$(“#结果1”);
结果2=$(“#结果2”);
});
函数切换(){
clearTimeout(lastDelayedResult);
clearTimeout(lastResetResults);
结果2.文本(“”);
spn.slideToggle();
result1.text(“文本为“+visibility()+”);
lastDelayedResult=setTimeout(函数(){delayedResult();},1000);
lastResetResults=setTimeout(函数(){resetResults();},3000);
}
函数可见性(){
返回(spn.is(':visible')?“visible”:“hidden”;
}
函数delayedResult(){
text(“一秒钟后,文本为“+visibility()+”);
}
函数resetResults(){
结果1.文本(“”);
结果2.文本(“”);
}
我是文本!
是否可以使用动画回调方法来保证元素的最终状态,而不是查询并可能获得错误的状态。由于您的示例旨在简单地演示问题,因此很难知道这是否适用于您的应用程序,但我几乎总是发现,将依赖于动画完成的代码放在回调中比处理动画过程更容易。我认为一个精心设计的示例会比使用500多行自定义插件寻求帮助获得更多响应;)我没有想到回调,因为show/hide方法的声明方式(作为插件选项)。我认为,只要多做一些工作和一些文档,我就可以使自定义动画继续使用动画回调。谢谢你的回复。