jquery - 如何选择一个元素并在其上调用 jquery 插件

Question

我的网站有一个常见问题解答部分，我想在其中显示使用此特定功能单击的问题答案的 div 的背景属性

// Extend jquery with flashing for elements
$.fn.flash = function(duration, iterations) {
    duration = duration || 1000; // Default to 1 second
    iterations = iterations || 1; // Default to 1 iteration
    var iterationDuration = duration / iterations;

    for (var i = 0; i < iterations; i++) {
        this.fadeOut(iterationDuration).fadeIn(iterationDuration);
    }
}

有什么方法可以使用调用语句

$("#someElementId").flash(1000, 4);

来实现这一点。我的 HTML 看起来像这样

---

<p><ul class="disc">
<li><a href="#a1">Question</a></li>

---

<div class="row"><a name="a1">
<strong>Question</strong>

<p>Answer</p>

<a href="#top"><em>Back to top</em></a>

Answer 1

是的，在你的元素上放置一些类并将它们捆绑在一起：

<p><ul class="disc">
<li><a href="#a1" class='question' data-num='1'>Question</a></li>
<div class="row"><a name="a1">
<strong>Question</strong>

<p class='answer-1'>Answer</p>

<a href="#top"><em>Back to top</em></a>

$(function(){
  $(".question").on('click', function(){
     var num = $(this).data('num');
     $(".answer-"+num).flash(1000, 4);
  });
});

在用户单击问题时加载文档时，我会检查存储在 data-num 属性中的问题编号。从中我可以得出我闪现的答案类。