2012-04-30 3 views
1

Примечание: с помощью JQuery 1.3.2 (Угу Я перехожу, но все равно должны быть в 1.3.2 для этого)Атрибут содержит селектор * альтернативный

Ищете лучший способ осуществить это

HTML Элемент (Это исходит из основы пользовательского PHP и очень громоздки, чтобы внести изменения в):

<select id="car[0][car_id]" name="car[0][car_id]"> 
    ... 100+ options 
</select> 

я могу добавить еще один выпадающий динамически, который выглядит следующим образом:

<select id="car[1][car_id]" name="car[1][car_id]"> 
    ... 100+ options 
</select> 

и

<select id="car[2][car_id]" name="car[2][car_id]"> 
    ... 100+ options 
</select> 

Теперь я итерация через них, как это:

function showCarinfo() { 
    for (var car_number = 0; $("#car\\["+car_number+"\\]\\[car_id\\]").length > 0; car_number++) { 
     // do stuff 
    } 
} 

по выбору изменения:

$("input[name*=car_id]").change(function(){ 
    // display info for each car selected from each drop down select menu 
    showCarinfo(); 
}); 

Есть ли лучший способ реализовать на изменения и итерационные методы? Я использую «Attribute Contains Selector» (http://api.jquery.com/attribute-contains-selector/), но похоже, что он вызывает большую проблему с производительностью при событии изменения.

UPDATE:

Я заменил * с $ искать последнюю часть, и это (я думаю) не поможет с производительностью немного, но все еще ищет, если это лучшее решение

$("input[name$=car_id]").change(function(){ 
    // display info for each car selected from each drop down select menu 
    showCarinfo(); 
}); 
+0

Какие браузеры a ты поддерживаешь? Вы все еще поддерживаете IE7 и ниже? –

+1

IE7 да, Нижний НЕТ! –

+2

FYI, '* =' не является * all-selector *. Это атрибут [* attribute-contains *] (http: //api.jquery.com/attribute-contains-selector /). Но первоначальный выбор не меняет производительность фактического события, когда он происходит. –

ответ

2

Производительность в вашей showCarinfo функции. Вы производите выбор DOM в цикле.

Не делайте этого. Вместо того, чтобы кэшировать выбор ...

function showCarinfo() { 
    var cars = $("input[name*=car_id]"); 
    for (var car_number = 0; car_number < cars.length; car_number++) { 
     cars.eq(i); // do stuff 
    } 
} 

или вы можете использовать .each()

function showCarinfo() { 
    $("input[name*=car_id]").each(function() { 
     // do stuff 
    }); 
} 

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

$("input[name*=car_id]").change(showCarinfo); 
0

Подобно тому, как догадка, но я хотел бы попробовать связывание change события для всех input элементов и их фильтрацию, когда событие называется:

$("input").change(function() { 
    if ($(this).attr('name').indexOf('car_id') == 0) { 
    showCarinfo(); 
    } 
}); 

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

0

Вы можете использовать это:

вопрос
$('input[name$="[car_id]"]').change(function(){ 
    // codes 
}); 
Смежные вопросы