我试图将页面上文本的显示延迟(实际上是在 Twine 中 - https://twinery.org/ ),延迟时间是在 span 对象的属性中定义的量,如下所示:
$(".fadeIn").each(function() {
alert(parseInt($(this).attr("fadeInAfter")))
});
$(".fadeIn").delay(parseInt($(this).attr("fadeInAfter"))).fadeIn(1000);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<span class="hide fadeIn" fadeInAfter="1000">This should fade in after 1 second</span>
<span class="hide fadeIn" fadeInAfter="5000">This should fade in after 5 seconds</span>
使用此代码,警报框会以正确的值触发,但范围会立即淡入。
我想做的事情可能吗?我的处理方式是否错误?
谢谢
最佳答案
您的代码之间有一个非常重要的区别,其中 alert()
被调用并设置延迟的代码: .each()
方法调用每个的回调函数 <span>
单独。这就是获取属性值有效的原因。在你的.delay()
调用时,代码的计算结果为 this
设置为调用上下文中的任何值。
很容易解决:做你的 .delay()
调用.each()
回调也:
$(".fadeIn").each(function() {
$(this).delay(parseInt($(this).attr("fadeInAfter"))).fadeIn(1000);
});
关于javascript - 我可以将 HTML 元素中的属性传递给 JQuery .delay() 函数吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61002828/