一些背景: 我有一个网站,其中包含一个显示实体列表的表格.使用jQuery我可以单击表中的一行,该行将使用 AJAX加载有关所选实体的一些额外数据.在单击的行下方的表中插入一个新行.此
我有一个网站,其中包含一个显示实体列表的表格.使用jQuery我可以单击表中的一行,该行将使用 AJAX加载有关所选实体的一些额外数据.在单击的行下方的表中插入一个新行.此行包含有关实体的更多详细信息,并且实际上不是一行,仅以 HTML术语表示.它包含大量数据.当您单击另一行时,将隐藏当前显示的详细信息行,并显示新单击实体的详细信息行(如果尚未加载,则使用AJAX加载).这里没问题.
在详细信息行上还有一个选择框.使用Ajax加载详细信息行后,我想绑定select的onchange事件.我做了以下jQuery选择:
$("tr.entity_details[data-entity-id=" + entityId + "] select#SelectedDropDownValue")
问题:
这也很好,除了在一些非常特殊的情况下(我还没有完全定义).有时它不会选择select元素.我使用VS2010进行调试并将这两个项目输入到我的监视窗口:
$("tr.entity_details[data-entity-id=" + entityId + "] select#SelectedDropDownValue").length $("tr.entity_details[data-entity-id=" + entityId + "] select[id=SelectedDropDownValue]").length
在第一个没有选择任何东西的情况下,第二个没有.这对我来说真的很奇怪,因为我认为那两个选择器是等价的.
我能够做到这一点的情况是:
我的桌子里有两个实体.
>我先点击底部:没问题;然后我点击顶部:没问题.
>我先点击顶部:没问题;然后我点击底部的一个:问题.
我不知道是什么原因引起的.我想也许是我插入新行并将其隐藏在javascript中,导致选择有点偏离.但那我认为这将是一个错误.或者它可能与详细信息行包含另一个表并且select在内部表的一侧有关.
编辑:
添加更多信息.我在IE9和Chrome下进行了测试.我正在使用jQuery 1.5.1开发ASP.NET MVC 3应用程序.详细信息行由部分视图生成.在这个局部视图中,我使用了Html Helper DropDownListFor.此助手根据传递给函数的C#属性生成select元素.它使用属性的名称为元素生成名称和id.这会导致页面中的所有选择元素具有相同的ID.正如一些人已经提到的那样,这可能是原因.
我在一个不合规的网站上工作.我们有许多具有相同ID的HTML元素.我注意到$(‘#someid’)只抓取它找到的第一个元素,而$(‘[id =“someid”]’)抓取所有带有该ID的元素.