Какое сокращение от этой инструкции jQuery?

Question

$( "input[role=submit_action], button[role=submit_action], div[role=submit_action], span[role=submit_action], a[role=submit_action]").live(  "click", function() {
});

и это тоже:

$( "input[role=submit_action], input[role=submit_require]").live(  "click", function() {
    if ($(this).attr('role') == "submit_action") {
            // do this...
    }
    else {
            // do this...
    }
});

Например, сокращение может быть:

$("input[role=(submit_action|submit_require)]"

Answer 1

Я бы использовал .delegate() здесь для эффективности (чтобы не пересекать каждый элемент DOM, изначально выполняющий селектор), например:

$(document.body).delegate("[role=submit_action]", "click", function() {
  //do stuff
});

Разница в том, что в отличие от .live(), это намного дешевле при запуске, так как $("role=submit_action]") (даже до вызова .live()) приходится повторять все элементы в DOM, проверяющие атрибут role, обходят эти расходы с помощью .delegate().

Поскольку производительность - это проблема, не поверьте мне на слово, проверьте это здесь:
http://jsperf.com/live-vs-delegate-test

Answer 2

При условии, что никакие другие элементы не могут иметь это role, вы можете написать селектор как

$( "[role=submit_action]").live(  "click", function() {});

Однако я бы не стал, так как поиск довольно дорогой, прежде чем он связывает функцию. Используйте delegate вместо:

$('body').delegate('[role=submit_action]','click',function() {});

Это функционально эквивалентно, за исключением того, что не требует дорогостоящего обхода DOM перед привязкой обработчика.

Answer 3

Я бы не стал менять первый, так как он эффективен таким, какой он есть. Можно сделать короче, используя:

$('[role=submit_action]')

.. но это потребует обхода каждого элемента в DOM, что значительно замедлит его. Вы можете использовать старты со селектором во втором примере, который все еще может быть в порядке:

$('input[role^=submit_]')...

В любом случае, если он не сломан, не чините его. :)

Answer 4

Попробуйте:

$( "[role=submit_action]").live("click", function() {
 //...
});

для второго, вы пытаетесь использовать оба на одной странице?