jQuery: выбор элемента на основе нескольких атрибутов - PullRequest
1 голос
/ 02 апреля 2012

У меня следующий HTML

<tr id="r1" class="l1">
                <td><img class="plusminus" id="r1c1" src="assets/images/plus.png" border="0" />3/10/12</td>
                <td></td>
                <td></td>
                <td>4,449,371</td>
                <td>27,399</td>
                <td>$500,000</td>
                <td>8.91%</td>
                <td>0.68%</td>
                <td>0.62%</td>
                <td>$0.04</td>
                <td>791</td>
                <td>2.8%</td>
                <td>$1.39</td>
            </tr>
            <tr id="r11" class="l2">
                <td></td>
                <td></td>
                <td>iPad Winner</td>
                <td>700,302</td>
                <td>2,472</td>
                <td>98.88</td>
                <td>8.07%</td>
                <td>0.68%</td>
                <td>0.62%</td>
                <td>$0.04</td>
                <td>791</td>
                <td>2.8%</td>
                <td>$1.39</td>
            </tr>
            <tr id="r12" class="l2">
                <td></td>
                <td></td>
                <td>iPad Winner2</td>
                <td>300,302</td>
                <td>2,472</td>
                <td>98.88</td>
                <td>8.07%</td>
                <td>0.68%</td>
                <td>0.62%</td>
                <td>$0.04</td>
                <td>791</td>
                <td>2.8%</td>
                <td>$1.39</td>
            </tr>

      <tr id="r2" class="l1">
                <td><img class="plusminus"  id="r2c1" src="assets/images/plus.png" border="0" />4/10/12</td>
                <td></td>
                <td></td>
                <td>4,4555,55</td>
                <td>27,399</td>
                <td>$500,000</td>
                <td>8.91%</td>
                <td>0.68%</td>
                <td>0.62%</td>
                <td>$0.04</td>
                <td>791</td>
                <td>2.8%</td>
                <td>$1.39</td>
            </tr>

<tr id="r21" class="l2">
                <td><img class="plusminus"  id="r2c1" src="assets/images/plus.png" border="0" />4/10/12</td>
                <td></td>
                <td></td>
                <td>4,4555,55</td>
                <td>27,399</td>
                <td>$500,000</td>
                <td>8.91%</td>
                <td>0.68%</td>
                <td>0.62%</td>
                <td>$0.04</td>
                <td>791</td>
                <td>2.8%</td>
                <td>$1.39</td>
            </tr>

Здесь r1 - родительская строка, в то время как r11 , * r12 * - дочерние строки, родительский класс имеет класс li, а дочерний - l2. Я использую следующий jQuery на событие клика id = r1, где все последующие идентификаторы с r1 и имеют класс l2

var pattern = 'r1';//just for example here
$('tr[id|="'+pattern+'"][class=l2]')

Мне нужен отфильтрованный результат, основанный на идентификатор, совпадающий с шаблоном И, имеющий класс = l2 . Как мне этого добиться?

Заранее спасибо

Ответы [ 2 ]

2 голосов
/ 02 апреля 2012

РЕДАКТИРОВАТЬ Это должно сработать:

var pattern = 'r1';//just for example here
$('tr[id^="'+pattern+'"][class=l2]')

Ваш селектор не работает, потому что вы используете '| =', который соответствует префиксу, за которым следует '-'.поэтому, если бы ваше соглашение об именах для дочерних строк было r1-1, r1-2, этот селектор был бы хорош.Вам нужно использовать '^ =', который выбирает атрибуты, начинающиеся с указанной строки.

Лично я бы вместо идентификаторов на дочерних строках просто указал родительский идентификатор как класс на дочерних строках - это делает вещинемного проще, чтобы все потомки id = r1 выглядели так:

<tr id="r1" class="l1"><td>I am a parent row</td></tr>
<tr class="l2 r1"><td>I am a child row of r1</td></tr>

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

$(".l1").click(function(){
var sel = $(this).attr("id");
var children = $("table").find("." + sel)

})

, но этоэто вопрос личных предпочтений.

0 голосов
/ 02 апреля 2012
$('id|=["' + pattern + '"] > .l2')

Что означает: дать мне всех детей с классом .l2 родителя с идентификатором префикса pattern

Редактировать: Извините, вы заметили, что вы былиищу префикс, обновленный код.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...