Question

假设我有一个有两个锚点的div：

<div id="#dialog">
    <a href="#" class="ok">Delete</a>
    <a href="#" class="cancel">Cancel</a>
</div>

为了使<a>锚点有效，我正在使用以下两个调用：

$('#dialog a.ok').click(function() {
    $.ajax({ ... });
    $(this).closest('#dialog').dialog('close');
});

 $('#dialog a.cancel').click(function() {
    $(this).closest('#dialog').dialog('close');
});

我希望能够将它组合成这样的东西：

$('#dialog').execute(function() {
    var dialog = $(this);

    dialog.find('a.ok').click(function() {
        $.ajax({ ... });
        dialog.dialog('close');
    });

    dialog.find('a.cancel').click(function() {
        dialog.dialog('close');
    });
});

伪exeucte()函数会立即执行匿名函数，而不会将其绑定到DOM事件。我想使用这种模式将相关功能组合在一起（在这种情况下，对话框有两个彼此密切相关的按钮）。

我的问题有两个：

我应该在这里使用的实际jQuery调用是什么？
这是将相关功能组合在一起的最佳方式吗？

Answer 1

你不需要任何特殊的jQuery东西，只需编写一个函数并将其作为参数赋予$('#dialog')：

function do_stuff(dialog) {
    dialog.find('a.ok').click(function() {
        $.ajax({ ... });
        dialog.dialog('close');
    });

    dialog.find('a.cancel').click(function() {
        dialog.dialog('close');
    });
}

do_stuff($('#dialog'));

或者，如果您真的有匿名函数，可以使用each：

$('#dialog').each(function() {
    var dialog = $(this);

    dialog.find('a.ok').click(function() {
        $.ajax({ ... });
        dialog.dialog('close');
    });

    dialog.find('a.cancel').click(function() {
        dialog.dialog('close');
    });
});

但是使用each和一个只能匹配单个元素的选择器看起来很有趣。您还可以定义自己的自执行功能：

(function(dialog) {
    dialog.find('a.ok').click(function() {
        $.ajax({ ... });
        dialog.dialog('close');
    });

    dialog.find('a.cancel').click(function() {
        dialog.dialog('close');
    });
})($('#dialog'));

这里没有最好的，你可以根据自己的具体情况和当地惯例使用。

如何在jQuery中选择一个元素并执行匿名函数而不将其绑定到事件？

1 个答案: