2015-04-29 4 views
2

Я пытаюсь выбрать все строки, у которых есть идентификатор атрибута данных с 1,2. Я могу сделать это, указав каждую строку отдельно, но это не лучший способ сделать это , может кто-нибудь поставить меня в правильном направлении, пожалуйста?Выберите несколько tr на основе предоставленных значений атрибутов данных

<table id="eTable"> 
    <tr data-empid="A123" data-salary="120" data-status="drone"> 
    <td>Peter</td><td>Vogel</td><td>Principal</td> 
    </tr> 
    <tr data-empid="B456" data-salary="130" data-status="worker"> 
    <td>Jan</td><td>Vogel</td><td>General Manager</td> 
    </tr> 
    <tr data-empid="C789" data-salary="110" data-status="worker"> 
    <td>Jason</td><td>van de Velde</td><td>Company nurse</td> 
    </tr> 
</table> 

Selector

var getFromWebServices = //GetFromWebServices() //result lets assume A123; B456 
$("#eTable tr[data-empid='A123; B456']").hide(); // hide is here for an example, I want to get object with all rows for matching IDs 

Я хочу, чтобы быть динамичным. Я хочу, чтобы этот селектор получал строки с empid A123; B456 в данном конкретном случае

Fiddle

http://jsfiddle.net/k6sx2313/2/

Редактировать

Почему это не возвращает все строки, но один за другим, http://jsfiddle.net/k6sx2313/10/

+0

Вы хотите скрыть tr, для которого присутствует 'data-empid'? –

+0

Попробуйте следующее: [http://jsfiddle.net/k6sx2313/5/](http://jsfiddle.net/k6sx2313/5/) –

ответ

0

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

$("#eTable tr[data-empid='A123'], #eTable tr[data-empid='B456']").hide(); 

Если вы ищете значения программно, можно поместить их в массив с помощью filter():

var values = [ 'A123', 'B456' ]; 
$('#eTable tr').filter(function() { 
    return $.inArray($(this).data('empid'), values) != -1; 
}).hide(); 

Example fiddle

3

Предполагая, что вы получаете идентификаторы в массиве (idArray), выполните цикл for и спрячьте каждый элемент с соответствующими данными:

var idArray = ['A123','B456']; 
for (var i=0;i<idArray.length;i++) { 
    var id = idArray[i]; 
    $("#eTable tr[data-empid=" + id + "]").hide(); 
} 
+0

Вы пропустили var до 'i'. – jcubic

+0

Исправлено, спасибо! – kapantzak

1

использование filter() для фильтрации data-empid элементы и проверять каждое значение присутствует в массиве с помощью indexOf()

var arr = ['A123', 'B456'] 
$("#eTable tr[data-empid]").filter(function() { 
    return arr.indexOf($(this).attr('data-empid')) != -1; 
}).hide(); 

demo

0

Тест:

var getFromWebServices = ['A123', 'B456']; 
 
$("#eTable tr[data-empid=" + getFromWebServices.join("], #eTable tr[data-empid=") + "]").hide();
<script src="http://code.jquery.com/jquery-latest.min.js"></script> 
 
<table id="eTable"> 
 
    <tr data-empid="A123" data-salary="120" data-status="drone"> 
 
    <td>Peter</td><td>Vogel</td><td>Principal</td> 
 
    </tr> 
 
    <tr data-empid="B456" data-salary="130" data-status="worker"> 
 
    <td>Jan</td><td>Vogel</td><td>General Manager</td> 
 
    </tr> 
 
    <tr data-empid="C789" data-salary="110" data-status="worker"> 
 
    <td>Jason</td><td>van de Velde</td><td>Company nurse</td> 
 
    </tr> 
 
</table>

Смежные вопросы