如何干净地定义 $().on() 选择器

Question

我正在使用现有的 jQuery（版本 3.2.1）函数：

$('#example').on('click', 'tbody td:not(:first-child)', 
   function (e) {
      // do stuff
  });

在这种情况下，function(e) 仅在 TD 不是该行的第一列时才会起作用。

如果我需要添加更多的非条件（恰好是一个至少有 5 个这样的列的表），该函数会变得有点难看。

在测试中，我知道它有效，但必须有更好的方法来做到这一点。

$('#example').on('click', 'tbody td:not(:first-child):not(:nth-
    child(2)):not(:nth-child(3))',  
function (e) {
   // do stuff
});

是否有更简洁的技术来指示选择器中的一组非条件？我在想我可以用一个函数替换选择器字符串，但我还没有看到使用中的示例，即使在jQuery website 上也是如此。

Answer 1

您在寻找类似this 的东西吗？

$("#example")
  .not(":first-child")
  .not(":nth-child(2)")
  .not(":nth-child(3)")
  .on('click', 
    function (e) {
     // do stuff
   });

免责声明：我没有检查这是否真的有效。

Answer 2

@lilezek 的回答很好。如果您希望将目标缩短为单行，您可以在其他地方的变量中定义字符串，然后将该变量作为选择器传递给您的事件处理程序。

var selector_foo = 'tbody td:not(:first-child):not(:nth-
child(2)):not(:nth-child(3))'
...
$('#example').on('click', selector_foo, 
    function (e) {
        // do stuff
});