javascript - 仅选择 jQuery 集合中的一个元素

Question

如何将事件限制为 jQuery 集合中的单个元素？

在下面的例子中，我尝试使用 .one()将行为(插入 HTML 的 <li class='close'>Close</li> 行)限制为单个实例。该行为确实只发生一次，但在 $( "ul>li>a" ) 的每个匹配元素上.我如何让它只发生一次，只发生在集合中的一个匹配元素上？

有什么想法吗？

$( "ul>li>a" ).one(
 "click",    
 function(){
  $( "ul ul")
  .prepend("<li class='close'>Close</li>")
 }
 ); 

提前致谢。

-作为

Answer 1

jQuery 选择返回一个数组。因此 $("selection")[0] 可以工作。然而，有更好的抽象方法，比如 .get(0) 或 .first() (如果你正在寻找选择/数组的第一个元素).

$("selection").get(index) 返回选择的纯 DOM 元素(在该特定索引处)，并且不包装在 jQuery 中对象。

$("selection").first() 返回所选内容的第一个 元素，并将其包装 在一个 jQuery 对象中。

因此，如果您不需要返回 first 元素，但仍需要 jQuery 功能，您可以执行 $($("selection").get(index)) 。

鉴于您的情况，这应该可以正常工作:

// bind the 'onclick' event only on the first element of the selection
$( "ul>li>a" ).first().click(function() {
    $( "ul ul").prepend("<li class='close'>Close</li>");
}); 

等同于:

$($( "ul>li>a" ).get(0)).click(function() {
    $( "ul ul").prepend("<li class='close'>Close</li>");
});

还有这个:

$($( "ul>li>a" )[0]).click(function() {
    $( "ul ul").prepend("<li class='close'>Close</li>");
});

---

我必须不同意 Ryan，与原生 JavaScript 数组功能相比，使用 CSS 选择字符串来过滤结果的成本相当高。