jQuery фильтрует идентификаторы, а затем фиксирует совпадения - PullRequest
Новая
       12

jQuery фильтрует идентификаторы, а затем фиксирует совпадения

3 голосов
/ 29 июня 2009

Я повторюсь. 

$jq("button").filter(function(){
    return this.id.match(/^user_(\d+)_edit$/);
}).click(function(){
    var matches = this.id.match(/^user_(\d+)_edit$/);
    var user_id = matches[1];

    alert('click on user edit button with ID ' + user_id);
});

Поэтому я хочу применить событие click к некоторым кнопкам, и в обработчике события click мне нужен идентификатор пользователя. Есть ли способ избежать второго матча? 

$jq("button").filter(function(){
    return this.id.match(/^user_(\d+)_edit$/);
}).click(function(){
    var user_id = some_magic_variable;

    alert('click on user edit button with ID ' + user_id);
});

Спасибо.

Ответы [ 3 ]

10 голосов
/ 29 июня 2009

Как насчет того, чтобы избежать первого матча? 

$jq("button[id^=user][id$=edit]").click(function() {

});

Выбирает все кнопки с идентификатором, который начинается с пользователя, а заканчивается edit.

Хотя, честно говоря, глядя на ваш вариант использования, было бы ПУТЬ лучше просто дать всем кнопкам, которые предназначены для редактирования пользователя, класс «edit_user», а затем просто сделать: 

$jq('button.edit_user').click(function() {

});

Это более чистый, быстрый и способ jQuery получить все элементы, которые служат аналогичной цели.

Что касается получения идентификатора пользователя, то на этом сайте было оживленное обсуждение пользовательских атрибутов ( Пользовательские атрибуты - Yay или nay? ), и я лично делаю data-userid='5' в своих элементах, а затем просто делаю var id = $(this).attr('data-userid'); чтобы получить ID. Легко и приятно. Однако не будет подтвержден как XHTML.

3 голосов
/ 29 июня 2009

Вы можете сохранить идентификатор на самом элементе (используя метод data jQuery) при выполнении фильтра, а затем получить это значение в обработчике кликов. 

$jq("button").filter(function(){
    var $this = $jq(this);
    var matches = $this.attr('id').match(/^user_(\d+)_edit$/);

    if (matches) {
        $this.data('idNumber', matches[1]);
    }

    return matches;
}).click(function(){
    var user_id = $(this).data('idNumber');

    alert('click on user edit button with ID ' + user_id);
});
0 голосов
/ 29 июня 2009

Лично я бы предварительно обработал DOM: 

$(function() {

$("button").each(function() { 
      var matches = $(this).attr("id").match(/^user_(\d+)_edit$/);

      if (matches) {
         $(this).data("user_edit_id",matches[1]);
      }
   }
});

Тогда вы можете просто: 

$("button").filter(function(){
    return $(this).data("user_edit_id");
}).click(function(){
    var user_id = $(this).data("user_edit_id");

    alert('click on user edit button with ID ' + user_id);
});

Это не идеальное решение того, что вы хотите, но это один из способов ...

...