jQuery Selector:ID以结尾吗?


393

有没有selector我可以用一个给定的字符串两端查询元素与ID?

假设我有一个ID为的元素ctl00$ContentBody$txtTitle。我怎样才能通过只得到txtTitle


16
好旧的母版页I​​D乱码!
马修·洛克

1
ClientIDMode=static从ASP.Net 4.0开始设置并摆脱此:)
Murali Murugesan 2013年

1
ClientIDMode = static对于尝试在转发器中查找元素的用户不起作用!
斯图尔特

Answers:


629

如果您知道元素类型,则:(例如:将“ element”替换为“ div”)

$("element[id$='txtTitle']")

如果您不知道元素类型:

$("[id$='txtTitle']")

更多可用信息



10
我会寻找以“ $ txtTitle”结尾的文件。带有'txt'前缀的风险不大,但是如果选择器为'NameTextBox',它将与'NameTextBox','FirstNameTextBox',LastNameTextBox'等匹配。– 2009
标记

11
匿名用户只是尝试编辑以下内容。将其添加为注释(似乎很有意义):这不会给出以id txtTitle结尾的元素。这是docs:api.jquery.com/element-selector ..element选择器等效于getElementsByTagName。它与元素的id无关。如果要访问以id结尾的元素,则使用此语法$(“ [id $ ='txtTitle']”)),或者如果您知道元素..eg的类型,则使用此语法$(“ div [id $ ='txtTitle']“)
Pekka

1
链接非常有用。不是页面本身,而是它分成了另外两个页面,这是我需要的。我学习了如何捕获标题的片段,例如,如果ID在“查看源”中显示为“ masterPage1_Control0_MyTableName_moreStuff”,则可以使用$(“ id * = MyTable]“)。想起来,我更喜欢id $。嗯...
卢卡斯

这找到元素document.getElementById("f:fTest:j_idt51:0:inpTest")。这不是$("[id$='inpTest']")。是因为ID中不允许使用冒号(但JSF添加了冒号!)?
Panu Haaramo '04

有没有办法像伪选择器那样将此选择器与CSS一起使用?
亚历杭德罗·纳瓦

250

正如马克·赫德(Mark Hurd)回答的那样,问题的答案是$("[id$='txtTitle']"),但是对于那些像我一样想要查找以给定字符串开头的id为所有元素(例如txtTitle)的元素,请尝试以下方法(doc):

$("[id^='txtTitle']")

如果要选择id 包含给定字符串(doc)的元素:

$("[id*='txtTitle']")

如果要选择id 不是给定字符串(doc)的元素:

$("[id!='myValue']")

(它也匹配没有指定属性的元素)

如果要选择id 包含给定单词的元素,并用空格doc分隔

$("[id~='myValue']")

如果要选择id 等于给定字符串或以该字符串开头且后跟连字符doc)的元素:

$("[id|='myValue']")

如果您添加一个实际回答问题的答案,即$(“ [id $ ='txtTitle']”)并将其放在列表的第一位,我将投票给您答案。我目前无法回答,因为您没有回答问题
艾伦·麦克唐纳

2
@AlanMacdonald我不确定添加它是否正确。接受答案很长时间后,我回答了这个问题,只是为了为访问者添加更多信息。我希望支持我答案的人也支持该问题的答案。
Romain Guidoux

1
@RomainGuidoux很公平,这是您的电话,但是我不赞成没有为所提出的问题提供解决方案的答案,因为如果新手来到页面并遇到与OP相同的问题,这并不明显已投票甚至无法回答问题的答案。如果您将其更改为回答问题,那么我会投票赞成您的回答,而不是接受的答案,因为它是更完整,更有用的答案。否则应该是对已接受答案的评论,而不是对问题的答案。
艾伦·麦克唐纳

1
@AlanMacdonald完成,您说服了我。
Romain Guidoux

33

尝试

$("element[id$='txtTitle']");

编辑:晚4秒:P



13

将下划线或$添加到要搜索的字词中比较安全,因此不太可能匹配以相同ID结尾的其他元素:

$("element[id$=_txtTitle]")

(其中element是您要查找的元素的类型-例如divinput等等。

(请注意,您建议您的ID中倾向于使用$符号,但是我认为.NET 2现在倾向于在ID中使用下划线,因此我的示例使用了下划线)。


1
是的,你是对的。ID属性使用下划线。名称属性使用美元符号。
乔什·斯托多拉

3

例如:选择<a>ID以_edit结尾的所有:

jQuery("a[id$=_edit]")

要么

jQuery("a[id$='_edit']")

3

由于这是ASP.NET,因此您可以简单地使用ASP <%=%>标记来打印生成的txtTitle ClientID:

$('<%= txtTitle.ClientID %>')

这将导致...

$('ctl00$ContentBody$txtTitle')

...呈现页面时。

注意:在Visual Studio中,Intellisense会大喊您将ASP标记放入JavaScript。您可以忽略它,因为结果是有效的JavaScript。


4
OP没有'ctl00$ContentBody$txtTitle',他有'txtTitle'您缺少#匹配ID 的领导。但是OP已经拒绝了类似的建议(自删除以来):除非我将Javascript直接放在标记中,否则这是行不通的,这是组织的噩梦。行为分离对于这个项目至关重要。
马丁·皮特斯

1

尝试这个:

<asp:HiddenField ID="0858674_h" Value="0" runat="server" />

var test = $(this).find('[id*="_h"').val();

0

为了在包含许多iframe的页面中找到以“ iFrame”结尾的iframe ID。

jQuery(document).ready(function (){     
                  jQuery("iframe").each(function(){                     
                    if( jQuery(this).attr('id').match(/_iFrame/) ) {
                            alert(jQuery(this).attr('id'));

                     }                   
                  });     
         });
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.