带有一个/两个元素的jQuery第一个和最后一个选择器答案

【问题标题】：jQuery first and last selectors with one/two elements带有一个/两个元素的jQuery第一个和最后一个选择器
【发布时间】：2011-07-20 00:59:18
【问题描述】：

如果有两个或更多元素，是否有一种简单的方法可以使用 jQuery 设置选择器以仅选择“最后一个”元素？如果只有一个元素，我希望第一个选择器触发，但第一个和最后一个选择器都会触发。如果有两个或更多元素，那么一切都会按预期运行。我现在有一个解决方法，我只是检查存在多少元素，然后设置其他代码，但我认为必须有更好的方法。

jQuery 的东西

$('div#firstDiv span:first').click(function(e) {
    alert('first span clicked');
});

$('div#firstDiv span:last').click(function(e) {
    alert('last span clicked');
});    

$('div#secondDiv span:first').click(function(e) {
    alert('first span clicked');
});

$('div#secondDiv span:last').click(function(e) {
    alert('last span clicked');
});

html 的东西

<div id="firstDiv">
    <span>Only Span</span>
</div>
<br />
<div id="secondDiv">
    <span>First Span</span>
    <br />
    <span>Second Span</span>
</div>

现场演示的 jsfiddle 链接 -> http://jsfiddle.net/dXPKz/

【问题讨论】：

标签： jquery jquery-selectors

【解决方案1】：

将您的 :last 规则也更改为 :not(:first)。这样，它们只会在找到超过 1 个元素时触发。

$('div#firstDiv span:last:not(:first)').click(function(e) {
    alert('last span clicked');
});

【讨论】：

这看起来应该可以。明天测试时，我会将您的答案标记为解决方案。

【解决方案2】：

我不确定您是否可以在一个选择器中执行此操作，但是您可以添加一个过滤器并使用 :not 选择器...如 here (jsFiddle) 所见...在一个选择器中执行此操作会很酷不过……

【讨论】：