Блог

Главная - Вопросы по программированию - Как мне выбрать элемент в jQuery и выполнить анонимную функцию, не привязывая ее к событию?

Как мне выбрать элемент в jQuery и выполнить анонимную функцию, не привязывая ее к событию?

#jquery #jquery-ui

#jquery #jquery-пользовательский интерфейс

Вопрос:

Допустим, у меня есть 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. Я хотел бы использовать этот шаблон для того, чтобы сгруппировать связанные функции вместе (в этом случае в диалоговом окне есть две кнопки, которые очень тесно связаны друг с другом).

Мой вопрос двоякий:

  1. Какой фактический вызов jQuery я должен использовать здесь?
  2. Это лучший способ группировки связанных функций вместе?

Комментарии:

1. Хороший вопрос! Я не знаю, лучший ли это способ, но .each(function(){ ... }) должен сработать.

Ответ №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'));

Здесь нет лучшего, вы используете то, что соответствует вашим конкретным обстоятельствам и местным соглашениям.