jQuery Selector: ID endet mit?

393

Gibt es eine selector, die ich nach Elementen mit einer ID abfragen kann, die mit einer bestimmten Zeichenfolge endet?

Angenommen, ich habe ein Element mit der ID ctl00$ContentBody$txtTitle. Wie kann ich das erreichen, indem ich nur passiere txtTitle?

jquery jquery-selectors

— Josh Stodola
quelle

16

gute alte Masterseite ID Mangling!

— Matthew Lock

1

Set ClientIDMode=staticab ASP.Net 4.0 und loswerden :)

— Murali Murugesan

1

ClientIDMode = static funktioniert nicht für diejenigen, die versuchen, ein Element in einem Repeater zu finden!

— Stuart

629

Wenn Sie den Elementtyp kennen, dann: (zB: 'Element' durch 'div' ersetzen)

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

Wenn Sie den Elementtyp nicht kennen:

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

Weitere Informationen verfügbar

Code-Snippet anzeigen

// the old way, needs exact ID: document.getElementById("hi").value = "kk";
$(function() {
  $("[id$='txtTitle']").val("zz");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="ctl_blabla_txtTitle" type="text" />

Erweitern Sie das Snippet

— Mark Hurd
quelle

10

Ich würde danach suchen und mit '$ txtTitle' enden. Es ist nicht so viel Risiko mit dem ‚txt‘ Präfix, aber wenn Sie Wähler ‚NameTextBox‘ ist, würde es passen ‚NameTextBox‘, ‚FirstNameTextBox‘, LastNameTextBox‘usw.

— Mark

11

Ein anonymer Benutzer hat gerade versucht, Folgendes zu bearbeiten. Hinzufügen als Kommentar (da dies sinnvoll erscheint): Die Elemente, die mit der ID txtTitle enden, werden nicht angegeben. Hier ist docs: api.jquery.com/element-selector ..element selector entspricht getElementsByTagName. Es hat nichts mit der ID des Elements zu tun. Wenn Sie auf Elemente zugreifen möchten, die mit id enden, verwenden Sie diese Syntax $ ("[id $ = 'txtTitle']") oder wenn Sie den Typ des Elements kennen ..eg div .., verwenden Sie dann diese Syntax $ ("div [id $ = 'txtTitle'] ")

— Pekka

1

Link war sehr nützlich. Nicht die Seite selbst, aber sie wurde in 2 zusätzliche Seiten aufgeteilt, die ich brauchte. Ich habe gelernt, wie Segmente eines Titels erfasst werden, z. B. wenn die ID als "masterPage1_Control0_MyTableName_moreStuff" in der Ansichtsquelle angezeigt wird. Ich konnte mich mit $ ("id *" an meine Tabelle von <asp: Table ID = "MyTable" binden. = MyTable] "). Kommen Sie und denken Sie darüber nach, ich mag es besser. Hmmm ...

— Lukas

Dies findet das Element document.getElementById("f:fTest:j_idt51:0:inpTest"). Das geht nicht $("[id$='inpTest']"). Liegt es daran, dass Doppelpunkt in der ID nicht zulässig ist (aber JSF fügt ihn hinzu!)?

— Panu Haaramo

Gibt es eine Möglichkeit, diesen Selektor mit CSS wie Pseudo-Selektoren zu verwenden?

— Alejandro Nava

250

Die Antwort auf die Frage lautet $("[id$='txtTitle']"), wie Mark Hurd antwortete , aber für diejenigen, die wie ich alle Elemente mit einer ID finden möchten, die mit einer bestimmten Zeichenfolge beginnt (z. B. txtTitle), versuchen Sie Folgendes ( doc ):

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

Wenn Sie möchten , Elemente auszuwählen , die ID enthält eine bestimmte Zeichenkette ( doc ):

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

Wenn Sie Elemente auswählen möchten, deren ID keine bestimmte Zeichenfolge ( doc ) ist:

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

(Es stimmt auch mit den Elementen überein, die nicht das angegebene Attribut haben.)

Wenn Sie Elemente auswählen möchten, deren ID ein bestimmtes Wort enthält, das durch Leerzeichen ( doc ) begrenzt ist:

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

Wenn Sie Elemente auswählen möchten, deren ID einer bestimmten Zeichenfolge entspricht oder mit dieser Zeichenfolge gefolgt von einem Bindestrich ( doc ) beginnt :

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

— Romain Guidoux
quelle

Wenn Sie die Frage hinzufügen, die die Frage tatsächlich beantwortet, z. B. $ ("[id $ = 'txtTitle']"), und sie an die erste Stelle in der Liste setzen, würde ich Ihre Antwort abstimmen. Ich kann im Moment nicht, weil Sie die Frage nicht beantworten

— Alan Macdonald

2

@ AlanMacdonald Ich bin nicht sicher, ob es richtig ist, es hinzuzufügen. Ich habe die Frage lange nach der Annahme einer Antwort beantwortet, um den Besuchern weitere Informationen hinzuzufügen. Ich hoffe, dass Leute, die meine Antwort positiv bewerten, auch die Antwort auf die Frage positiv bewerten.

— Romain Guidoux

1

@RomainGuidoux Fair genug, es ist Ihr Anruf, aber ich stimme nicht mit Antworten überein, die keine Lösung für die gestellte Frage bieten, da es für Neulinge, die das gleiche Problem wie das OP haben, nicht offensichtlich ist, wenn sie auf die Seite kommen und es ein Up gibt gewählte Antwort, die die Frage nicht einmal beantwortet. Wenn Sie es ändern, um die Frage zu beantworten, würde ich Ihre Antwort anstelle der akzeptierten Antwort positiv bewerten, da es eine umfassendere und nützlichere Antwort ist. Ether das oder es hätte eher ein Kommentar zur akzeptierten Antwort als eine Antwort auf die Frage sein sollen.

— Alan Macdonald

1

@ AlanMacdonald Fertig, du hast mich überzeugt.

— Romain Guidoux

33

Versuchen

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

bearbeiten: 4 Sekunden zu spät: P.

— kkyy
quelle

32

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

Es ist nicht unbedingt erforderlich, das Textfragment zu zitieren, mit dem Sie übereinstimmen

— Scott Evernden
quelle

2

Dies sollte die richtige Antwort sein! Die Verwendung von "und 'ist nur verwirrend.

— Kees C. Bakker

13

Es ist sicherer, den Unterstrich oder $ zu dem gesuchten Begriff hinzuzufügen, damit es weniger wahrscheinlich ist, dass er mit anderen Elementen übereinstimmt, die mit derselben ID enden:

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

(wo Element der Typ des Elements ist Sie versuchen zu finden - zB div, inputusw.

(Beachten Sie, dass Ihre IDs in der Regel $ -Zeichen enthalten, aber ich denke, dass .NET 2 jetzt eher Unterstriche in der ID verwendet, sodass in meinem Beispiel ein Unterstrich verwendet wird.)

— Nick Gilbert
quelle

1

Ja, du hast recht. Die ID-Eigenschaft verwendet einen Unterstrich. Die Eigenschaft name verwendet ein Dollarzeichen.

— Josh Stodola

3

Ein Beispiel: <a>Um alle s mit einer ID auszuwählen, die auf _edit endet:

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

oder

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

— Anton K.
quelle

3

Da dies ASP.NET ist, können Sie einfach das ASP-Tag <% =%> verwenden, um die generierte ClientID von txtTitle zu drucken:

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

Dies führt zu ...

$('ctl00$ContentBody$txtTitle')

... wenn die Seite gerendert wird.

Hinweis: In Visual Studio schreit Intellisense Sie an, weil Sie ASP-Tags in JavaScript eingefügt haben. Sie können dies ignorieren, da das Ergebnis gültiges JavaScript ist.

— Michael
quelle

4

Das OP hat nicht 'ctl00$ContentBody$txtTitle', er hat 'txtTitle', und Sie vermissen die Führung #, die mit einer ID übereinstimmt. Das OP hat jedoch bereits einen ähnlichen Vorschlag abgelehnt (seitdem gelöscht): Dies funktioniert nur, wenn ich mein Javascript direkt in das Markup eingefügt habe, was ein organisatorischer Albtraum ist. Verhaltenstrennung ist für dieses Projekt von entscheidender Bedeutung.

— Martijn Pieters

1

Versuche dies:

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

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

— pawel
quelle

0

Um eine Iframe-ID zu finden, die auf einer Seite mit vielen Iframes mit "iFrame" endet.

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

                     }                   
                  });     
         });

— neelmeg
quelle