如何选择具有“数据名称”的HTML元素

我已经尝试了来自谷歌的一些建议，但它不适合我。我有一个表，每个tr都有一个td，它的样式设置为none，即它是不可见的。如何选择具有“数据名称”的HTML元素

这是HTML：

<tr class="grid-row grid-row-selected"> 
<td class="grid-cell" data-name="ChkSelected" style="display: none;"><input id="chkBulk" name="chkBulk" type="checkbox" value="true"><input name="chkBulk" type="hidden" value="false"></td><td class="grid-cell" data-name="Id">6382</td><td class="grid-cell" data-name="MembershipNumber">74073565</td><td class="grid-cell" data-name="DateReceived">24/07/2014 00:00:00</td><td class="grid-cell" data-name="Fullname">Esther Hills</td><td class="grid-cell" data-name="ApplicationType">CEng</td><td class="grid-cell" data-name="FirstCheckDoneBy">chrisw</td><td class="grid-cell" data-name="AssignedStaffMem"><b> 
<select id="ddlStaff" name="ddlStaff"><option value="susang">Susan Goulding</option> 
<option value="kevinm">Kevin Murphy</option> 
<option value="fionas">Fiona Spinks</option> 
<option value="marilynw">Marilyn Wharton</option> 
<option value="pamellar">Pamella Rivadulla-Rey</option> 
<option value="SARAHS">Sarah Saw</option> 
<option value="warrenjl">Warren John-Lewis</option> 
<option value="carolinh">Carolin Harvey</option> 
<option value="RACHAELB">Rachael Boysen</option> 
<option value="katem">Kate MacGregor</option> 
<option value="christ">Christiaan Thelen</option> 
</select> 
      </b> 
</td><td class="grid-cell" data-name=""><b> <a href="#" onclick="AssignStaff(6382, &quot; Esther Hills &quot;, 6382)"> 
     Assign</a> </b> 
</td> </tr>

我想改变这一点：

<td class="grid-cell" data-name="ChkSelected" style="display: none;">

因此，它是可见的，这样用户可以点击复选框。

这是我的代码

$(document).ready(function() { 
      if ($(AssignOnBulk).is(':checked')) { 
       $("#bulkAssign").show(); 
       alert($('td [data-name="ChkSelected"]').html()); 
       $('td.grid-cell [data-name="ChkSelected"]').show(); 
      } 
      else { 
       $("#bulkAssign").hide(); 
       $('[data-name="ChkSelected"]').hide(); 
      } 
     });

这条线应该用数据名称的所有TDS设置为风格= diplay：块

$('td.grid-cell [data-name="ChkSelected"]').show();

任何人都知道，选择与“数据元素“名称”属性？

来源

2014-09-01 nick gowdy

尝试删除td.grid-cell'和''之间的空间[数据-NAME =” ...' – HenningCash 2014-09-01 11:32:17

$('td.grid-cell [data-name="ChkSelected"]').show();

有一个空格在单元格和[，在jQuery选择器Spac中e表示在子元素中搜索，因此您的选择器正在搜索td内的元素，而[data-name="ChkSelected"]而不是td本身。

这应该为你工作：

$('td.grid-cell[data-name="ChkSelected"]').show();

来源

2014-09-01 11:37:21 Exlord

谢谢，你的解释让我和你的代码它看起来并不复杂，但当我不仅仅选择一个ID或Class时，我总是忘记语法。 – 2014-09-01 11:43:33

尝试用jQuery的.map和.data方法，它将对所有TD工作

$("td").map(function(i,e){ 
    var dn = $(e).data("name"); 
    if(dn === 'ChkSelected') 
    $(e).show(); 
});

看到working DEMO与扩展的例子

来源

2014-09-01 11:30:18 diEcho

用作

$('td[class="grid-cell"][data-name="ChkSelected"]').show();

来源

2014-09-01 11:32:45 Amit

如何选择具有“数据名称”的HTML元素

回答

相关问题