Вибір jQuery: Id закінчується?


393

Чи тут є selector запит на елементи з ідентифікатором, який закінчується заданим рядком?

Скажіть, у мене є елемент з ідентифікатором ctl00$ContentBody$txtTitle. Як я можу це зробити, проходячи просто txtTitle?


16
хороший старий ідентифікатор основної сторінки!
— Меттью Лок

1
Виберіть ClientIDMode=staticз ASP.Net 4.0 і позбудьтесь цього :)
— Murali Murugesan

1
ClientIDMode = статичний не працюватиме для тих, хто намагається знайти елемент у ретрансляторі!
— Стюарт

Відповіді:


629

Якщо ви знаєте тип елемента, тоді: (наприклад: замініть 'елемент' на 'div')

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

Якщо ви не знаєте тип елемента:

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

Більше інформації доступно



10
Я б шукав, що це закінчується на "$ txtTitle". Це не так великий ризик з префіксом 'txt', але якщо ви вибрали 'NameTextBox', він би відповідав 'NameTextBox', 'FirstNameTextBox', LastNameTextBox 'і т. Д.
— Марк

11
Анонімний користувач просто спробував відредагувати наступне в. Додавши його до коментаря (як здається, це має сенс): Це не дає елементам, що закінчуються id txtTitle. Ось документи: api.jquery.com/element-selector .. Селектор елементів є еквівалентом getElementsByTagName. Це не має нічого спільного з ідентифікатором елемента. Якщо ви хочете отримати доступ до елементів, що закінчуються на id, тоді використовуйте цей синтаксис $ ("[id $ = 'txtTitle']") або якщо ви знаєте тип елемента ..eg div .., тоді використовуйте цей синтаксис $ ("div [id $ = 'txtTitle'] ")
— Pekka

1
Посилання було дуже корисним. Не сама сторінка, але вона розгорнулася на 2 додаткові сторінки, які мені були потрібні. Я дізнався, як захоплювати сегменти заголовка, наприклад, якщо ідентифікатор призначається як "masterPage1_Control0_MyTableName_moreStuff" у View Source, я міг зафіксувати свою таблицю <asp: Table ID = "MyTable" ... за допомогою $ ("id * = MyTable] "). Подумайте, мені більше подобається id $. Гммм ...
— Лукас

Це знаходить елемент document.getElementById("f:fTest:j_idt51:0:inpTest"). Це не так $("[id$='inpTest']"). Це тому, що товсту кишку заборонено в ідентифікаторі (але JSF додає її!)?
— Пану Хаарамо

Чи існує спосіб використання цього селектора з CSS, як псевдоселектори?
— Алехандро Нава

250

Відповідь на питання $("[id$='txtTitle']"), як відповів Марк Херд , але для тих, хто, як я, хочуть знайти всі елементи з ідентифікатором, який починається з заданого рядка (наприклад, txtTitle), спробуйте це ( doc ):

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

Якщо ви хочете вибрати елементи, ідентифікатор яких містить заданий рядок ( doc ):

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

Якщо ви хочете вибрати елементи, ідентифікатор яких не є заданим рядком ( doc ):

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

(він також відповідає елементам, які не мають вказаного атрибута)

Якщо ви хочете вибрати елементи, id яких містить задане слово, розділене пробілами ( doc ):

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

Якщо ви хочете вибрати елементи, ідентифікатор яких дорівнює заданому рядку, або починаючи з цього рядка, а потім дефісом ( doc ):

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

Якщо ви додасте той, який насправді відповідає на питання, тобто $ ("[id $ = 'txtTitle']"), і поставте його першим у списку, я б голосував за вашу відповідь. На даний момент я не можу, тому що ви не відповідаєте на питання
— Алан Макдональд

2
@AlanMacdonald Я не впевнений, що правильно його додати. Я відповів на питання довгий час після того, як відповідь була прийнята, просто для того, щоб додати більше інформації для відвідувачів. Я сподіваюся, що люди, які схвалюють мою відповідь, також схвалюють відповідь на питання.
— Ромен Гіду

1
@RomainGuidoux досить чесний - це ваш дзвінок, але я не прихиляю відповіді, які не пропонують вирішення поставленого питання, тому що це не очевидно для новачків, які відчувають ту саму проблему, що і ОП, якщо вони приходять на сторінку, і там є відповідь, що не відповідає навіть на запитання. Якщо ви змінили його, щоб відповісти на запитання, я б схвалив вашу відповідь замість прийнятої відповіді, оскільки це більш повна і корисна відповідь. Ефір це чи це повинен був бути коментарем до прийнятої відповіді, а не відповіддю на питання.
— Алан Макдональд

1
@AlanMacdonald Готово, ти мене переконав.
— Ромен Гіду

33

Спробуйте

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

редагування: затримка на 4 секунди: P


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

Не обов'язково цитувати текстовий фрагмент, проти якого ви співпадаєте


2
Це має бути правильна відповідь! Використання "і" лише заплутано.
— Kees C. Bakker

13

Безпечніше додавати підкреслення або $ до терміна, який ви шукаєте, так що менше шансів відповідати іншим елементам, які закінчуються тим самим ідентифікатором:

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

(де елемент - тип елемента, який ви намагаєтесь знайти - наприклад div, inputі т.д.

(Зверніть увагу, ви припускаєте, що у ваших ідентифікаторів зазвичай є знаки $, але я думаю, що .NET 2 зараз, як правило, використовує підкреслення в ідентифікаторі, тому мій приклад використовує підкреслення).


1
Так, ти правий. Властивість ідентифікатора використовує підкреслення. Властивість імені використовує знак долара.
— Джош Стодола

3

Приклад: вибрати всі <a>s, ідентифікатор, що закінчується _edit:

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

або

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

3

Оскільки це ASP.NET, ви можете просто використовувати тег ASP <% =%> для друку згенерованого ClientID txtTitle:

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

Це призведе до ...

$('ctl00$ContentBody$txtTitle')

... коли сторінка надається.

Примітка. У Visual Studio Intellisense буде кричати на вас за те, що ви розміщуєте теги ASP в JavaScript. Ви можете проігнорувати це, оскільки в результаті дійсний JavaScript.


4
У ОП немає 'ctl00$ContentBody$txtTitle', у нього є 'txtTitle', і вам не вистачає ведучого, #який відповідає ідентифікатору. Але ОП вже відхилила подібну пропозицію (з моменту видалення): Це не спрацює, якщо я не поставлю свій Javascript безпосередньо в розмітку, що є організаційним кошмаром. Поведінкове розмежування має вирішальне значення для цього проекту.
— Martijn Pieters

1

Спробуйте це:

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

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

0

Для того, щоб знайти ідентифікатор iframe, що закінчується на "iFrame" на сторінці, що містить безліч кадрів.

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

                     }                   
                  });     
         });
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.