Question

美化以下代码最优雅的方法是什么？我想摆脱重复的代码：

$('#popup_settings_enable_name').click(function() {
    $el = $('#popup_settings_name_field');
    if ($(this).prop('checked')) {
        $el.removeAttr("disabled");
    } else {
        $el.attr("disabled", "disabled");
    }
}).each(function() {
    $el = $('#popup_settings_name_field');
    if ($(this).prop('checked')) {
        $el.removeAttr("disabled");
    } else {
        $el.attr("disabled", "disabled");
    }
});

Answer 1

使用.triggerHandler安装click后，您只需触发$('#popup_settings_enable_name') .click(function() { // ... }) .triggerHandler('click');事件处理程序：

.trigger

请注意，.trigger在许多情况下也会执行完全相同的操作，但您应该注意.triggerHandler和{{1}}之间存在细微差别。手册页明确提到了它们。

Answer 2

您只需触发事件即可执行初始化处理程序：

$('#popup_settings_enable_name').click(function() {
    …
}).click();

另一种方法是使用函数声明：

function update() {
    // a little simplification:
    $('#popup_settings_name_field').prop("disabled", !this.checked);
}
$('#popup_settings_enable_name').click(update).each(update);

Answer 3

手动触发点击事件可能会产生意想不到的副作用（如果还有其他代表也被分配了点击事件，该怎么办？）

我建议将重复的代码重构为自己的方法，然后简单地将该方法传递给jQuery .click()函数，然后将其传递给jQuery .each()函数。

摆脱jQuery中的重复代码

3 个答案: