jQuery - 同一个函数的多个触发器

Question

我正在开发一些 jQuery，但我是初学者，所以它有点臃肿而且不是很优雅。基本上，我希望在提交两种表单之一或单击它们的提交按钮时使 cookie 值无效。但是我不知道如何合并函数的条件，这样我只需要写出一次函数，所以我能做的最好是这样：

$('form#searchform-basic').submit(function() {
    $.cookie('tab_cookie', null);
});
$('form#searchform-basic a.search').click(function() {
    $.cookie('tab_cookie', null);
});
$('form#searchform-advanced').submit(function() {
    $.cookie('tab_cookie', null);
});
$('form#searchform-advanced input#search-button-submit').click(function() {
    $.cookie('tab_cookie', null);
});

一定有更好的方法，对吧？

在有人问之前，是的，您会认为您只需要知道何时提交表单。但是省略单击事件意味着单击提交按钮时该函数不会运行。我不知道为什么会这样，就是这样。

Answer 1

给你的函数起个名字，像这样：

function ClearCookie() {
    $.cookie('tab_cookie', null);
}

这样，您可以根据需要从多个事件中调用它。

$('form#searchform-basic').submit(ClearCookie);
$('form#searchform-basic a.search').click(ClearCookie);
$('form#searchform-advanced').submit(ClearCookie);
$('form#searchform-advanced input#search-button-submit').click(ClearCookie);

瞧！

更进一步，您可以组合调用相同事件（提交或点击）的选择器，如下所示：

$('form#searchform-basic, form#searchform-advanced').submit(ClearCookie);
$('form#searchform-basic a.search, form#searchform-advanced input#search-button-submit').click(ClearCookie);

我可能会放弃表单标签而只使用 ID，但这只是我。

$('#searchform-basic, #searchform-advanced').submit(ClearCookie);
$('#searchform-basic a.search, #searchform-advanced input#search-button-submit').click(ClearCookie);

Answer 2

$('oneselector','second','third').click(function() {
    $.cookie('tab_cookie', null);
});

试试看

Answer 3

因为点击提交按钮实际上是提交表单，所以您不需要将任何点击处理程序绑定到提交按钮，只需将您的控件绑定到表单的提交操作（这是由于单击提交按钮）。

要将其简化为一行，请在表单中添加一个类，例如 clear-cookie。

<form id="searchform-basic" class="clear-cookie"> ... </form>
<form id="searchform-advanced" class="clear-cookie"> ... </form>

$("form.clear-cookie").submit(function(){
  $.cookie('tab_cookie', null);
});

更多的选择器，但是，如上所述，您可以执行以下操作：

$("#searchform-basic, #searchform-advanced").submit( ... );

但我发现我通常使用类对相关元素进行分组。