我可以将 HTML 元素中的属性传递给 JQuery .delay() 函数吗？

Question

我试图将页面上文本的出现（实际上是在 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>

使用此代码，警报框会显示正确的值，但范围会立即淡入。

我想做的事情可能吗？我的处理方式是错误的吗？

谢谢，

Answer 1

alert()调用的代码和设置延迟的代码之间有一个非常重要的区别：该方法为每个单独.each()调用回调函数。这就是获取属性值有效的原因。在您的调用中，代码将被评估并设置为调用上下文中的任何内容。&nbsp;<span>.delay()this修复起来很容易：也在回调.delay()中进行调用.each()：$(".fadeIn").each(function()&nbsp;{ &nbsp;&nbsp;$(this).delay(parseInt($(this).attr("fadeInAfter"))).fadeIn(1000); });