使用jQuery获取带有id的特定标签

Question

我正在为工作项目使用this Bootstrap插件（所以是的，当我把它放在这里时，代码将被严格审查。）插件接受JSON对象（在ColdFusion 10中创建）和puts他们进入HTML表格。

我基本上有一个表，它有两个列，只是复选框，已分配和完成。插件会删除th标签的内容，即<th>Complete</th>，并在该字段中放置一个复选框。插件创建者表示我基本上是靠自己解决这个问题，使用前面给出的链接中的示例。

因此。我已经为这些电话分配了ID标签，即<th data-field="ASSIGNED" id="assigned" data-formatter="chkBoxFormatter" data-title="Assigned" data-align="center" data-valign="bottom" data-sortable="false" data-checkbox="true">Assigned</th>，并且我正在尝试使用jQuery来抓取这些元素，只有第四个框本身，只留下行，所以我可以自己解决这个问题。 $（“＃assigned”）不起作用，我对第n个子选择器等很警惕，因为如果后续开发人员重新排列列顺序，它就会中断。我希望解决方案对未来的开发人员来说更难以打破。

FWIW，这是使用最新版本的jQuery和Bootstrap，将Modernizer加载到浏览器中但尚未使用（我正在使用它！）我不反对添加jQueryUI，如果它有帮助，但是由于超出本文范围的原因，我们正在回避jQuery Mobile。哦，这些都在标签中，因为插件需要它。

是的，我尝试过谷歌搜索，并阅读官方的jQuery文档，但所提出的解决方案要么是古老的，要么看起来太“脆弱”。

TLDR版本：我想选择特定的标签并强制插入文字。

Answer 1

在HTML中，id属性应该是唯一的。因此，具有相同ID的多个元素是错误的。一些选项是使用唯一的类选择器或添加自己的唯一属性

<th class="my_assigned" data-field="ASSIGNED" data-formatter="chkBoxFormatter" data-title="Assigned" data-align="center" data-valign="bottom" data-sortable="false" data-checkbox="true">Assigned</th>
$('.my_assigned') ...

或者因为看起来这些属性是独一无二的，所以只是指责这些属性。

<th data-field="ASSIGNED" id="assigned" data-formatter="chkBoxFormatter" data-title="Assigned" data-align="center" data-valign="bottom" data-sortable="false" data-checkbox="true">Assigned</th>
$('[data-field=ASSIGNED]') ...

Answer 2

#selectors表示一个唯一的对象id，这意味着你应该只有一个id =＆＃34;分配了＃34;。另一方面，您可以拥有许多具有相同类别的元素。

所以，也许解决方案是切换你的＆＃34;分配的＆＃34;类的属性，如：

<th data-field="ASSIGNED" class="assigned" data-formatter="chkBoxFormatter" data-title="Assigned" data-align="center" data-valign="bottom" data-sortable="false" data-checkbox="true">Assigned</th>

除此之外，您可以使用

选择它们

$('*[data-title="Assigned"]');

Answer 3

@Janet

由于$("#assigned").length返回0，表示此时TH元素不存在。

您需要确保已经呈现了表格TH元素。

换句话说，在您需要使用$("#assigned")时，您正在寻找的元素尚未存在于DOM中。

试试看你得到了什么：

setTimeout(function(){
   console.log($("#assigned").length);
}, 5000);

匿名函数将在5秒内异步执行。希望到那时你的TH将被渲染。

修改

我的JSFiddle