ID + eine beliebige Zahl in jQuery auswählen

7

Ich bin neu bei stackoverflow und jQuery, also habe ich ein paar Probleme mit der Erstellung einer einfachen Funktion.

Ich habe grundsätzlich auf meiner Website eine zufällige Anzahl von Links mit id "filtro" + "some number" , und ich möchte nur einen Code für die Aktion des Klickens in einem von ihnen schreiben (das würde später auf die Klasse mit dem gleichen "filtro" + auswirken "eine Nummer").

ZB: Klicken Sie auf "# filtro3", machen Sie etwas auf ".filtro3".

Das Problem ist, ich weiß nicht, wie ich die Zeichenfolge in jQuery für "irgendeine Zahl" schreiben soll. Ich denke darüber nach, so etwas zu tun:

%Vor%

Irgendwelche Ideen? Danke!

Ps .: Dies ist meine erste Frage, und ich entschuldige mich, wenn ich Fehler gemacht habe.

Gelöst. Dystoys Lösung funktionierte wie ein Zauber.

Für zukünftige Verweise auf andere habe ich diesen Code erstellt, um ein einfaches Filtermenü für eine Bildergalerie zu erstellen . Auf diese Weise konnte ich Bilder bestimmter Themen verbergen / anzeigen.

    
Fernanda Nia Ferreira 08.08.2013, 15:20
quelle

4 Antworten

16

Sie scheinen wollen

%Vor%

Erklärungen:

  • $("[id^=filtro]") verwendet die beginnt mit dem Selektor , um alle Elemente auszuwählen, deren ID mit "filtro"
  • this.id.slice(6); nimmt den Teil der ID, der nach dem sechsten Zeichen beginnt. Vielleicht wäre es klarer als this.id.slice('filtro'.length) oder this.id.substring('filtro'.length)
Denys Séguret 08.08.2013, 15:22
quelle
3
___ antwort18130739 ___

Es gibt einige gute Antworten auf Ihre ursprüngliche Frage, aber ich möchte eine potenziell sauberere Alternative vorschlagen.

Sie könnten data-* Attribute anstelle von IDs für die Auswahl Ihrer Elemente verwenden. Zum Beispiel könnten Ihre Elemente wie

aussehen %Vor%

Dann können Sie diese Elemente mit $('[data-filtro]') auswählen und $(this).data('filtro') im Callback verwenden. Zum Beispiel

%Vor%

Diese Technik wird an vielen Stellen verwendet, einschließlich des Foundation-Frameworks. Es macht es einfacher, Ihr Verhalten in ein separates Plugin zu extrahieren, das nicht von Element-IDs abhängig ist. Wenn die Anwendung komplizierter wird und die Anzahl der mit jedem Element verbundenen Verhaltensweisen zunimmt, sieht jedes Element wie

aus %Vor%

statt

%Vor%     
___ qstnhdr ___ ID + eine beliebige Zahl in jQuery auswählen ___ answer18130478 ___

Wenn %code% des angeklickten Elements und %code% der Elemente, die Sie ändern möchten, gleich sind, sollte es so einfach sein wie die Verwendung von %code% des Elements als Eingabe für die Klasse Selektor:

Verwenden Sie Ihren Code als Basis:

%Vor%

Ich gehe beispielsweise davon aus, dass die Zielelemente %code% s sind. . . Dies würde dazu führen, dass %code% -Elemente mit der übereinstimmenden Klasse in rotem Text angezeigt werden:

%Vor%

Da ich sehe, dass du neu bei JQuery bist. . .

  • Wie dystoil sagte, wählt %code% alle Elemente mit% und %code% , die mit "filtro" beginnen.
  • %code% erhält das %code% des aktuellen Elements (d. h. dasjenige, das gerade angeklickt wurde)
  • %code% übernimmt das %code% und macht es zu einem Klassenselektor, indem es "." zu Beginn. Dadurch werden alle Elemente ausgewählt, die den Wert %code% haben, der mit dem Wert %code% des Elements identisch ist, auf das Sie geklickt haben.

Bearbeiten: - Sie könnten auch %code% (Standard-JavaScript) anstelle von %code% verwenden, was einfach JQuerys Methode ist, dasselbe zu erreichen.

    
___ answer18129934 ___

Sie scheinen wollen

%Vor%

Erklärungen:

  • %code% verwendet die beginnt mit dem Selektor , um alle Elemente auszuwählen, deren ID mit "filtro"
  • %code% nimmt den Teil der ID, der nach dem sechsten Zeichen beginnt. Vielleicht wäre es klarer als %code% oder %code%
___ qstntxt ___

Ich bin neu bei stackoverflow und jQuery, also habe ich ein paar Probleme mit der Erstellung einer einfachen Funktion.

Ich habe grundsätzlich auf meiner Website eine zufällige Anzahl von Links mit %code% , und ich möchte nur einen Code für die Aktion des Klickens in einem von ihnen schreiben (das würde später auf die Klasse mit dem gleichen "filtro" + auswirken "eine Nummer").

ZB: Klicken Sie auf "# filtro3", machen Sie etwas auf ".filtro3".

Das Problem ist, ich weiß nicht, wie ich die Zeichenfolge in jQuery für "irgendeine Zahl" schreiben soll. Ich denke darüber nach, so etwas zu tun:

%Vor%

Irgendwelche Ideen? Danke!

Ps .: Dies ist meine erste Frage, und ich entschuldige mich, wenn ich Fehler gemacht habe.

Gelöst. Dystoys Lösung funktionierte wie ein Zauber.

Für zukünftige Verweise auf andere habe ich diesen Code erstellt, um ein einfaches Filtermenü für eine Bildergalerie zu erstellen . Auf diese Weise konnte ich Bilder bestimmter Themen verbergen / anzeigen.

    
___ answer18130214 ___
%Vor%

LIVE-DEMO

Der %code% in %code% ist der "Beginnt mit" Selektor welcher %code% irgendein Element und welche ID beginnt mit %code% < br>

Lassen Sie uns nun ein wenig Regex verwenden, um die Nummer aus der ID abzurufen,
%code% erhält den Namen "dieser geklickte Element-ID" und ruft alle Zahlen ab %code%
Diese Nummer wird dann verwendet, um Ihren CLASS-Elementselektor zu finden.

    
___
James Lim 08.08.2013 16:02
quelle
1

Wenn id des angeklickten Elements und class der Elemente, die Sie ändern möchten, gleich sind, sollte es so einfach sein wie die Verwendung von id des Elements als Eingabe für die Klasse Selektor:

Verwenden Sie Ihren Code als Basis:

%Vor%

Ich gehe beispielsweise davon aus, dass die Zielelemente <div> s sind. . . Dies würde dazu führen, dass <div> -Elemente mit der übereinstimmenden Klasse in rotem Text angezeigt werden:

%Vor%

Da ich sehe, dass du neu bei JQuery bist. . .

  • Wie dystoil sagte, wählt $("[id^=filtro]") alle Elemente mit% und id , die mit "filtro" beginnen.
  • $(this).prop("id") erhält das id des aktuellen Elements (d. h. dasjenige, das gerade angeklickt wurde)
  • $("." + $(this).prop("id")) übernimmt das id und macht es zu einem Klassenselektor, indem es "." zu Beginn. Dadurch werden alle Elemente ausgewählt, die den Wert class haben, der mit dem Wert id des Elements identisch ist, auf das Sie geklickt haben.

Bearbeiten: - Sie könnten auch this.id (Standard-JavaScript) anstelle von $(this).prop("id") verwenden, was einfach JQuerys Methode ist, dasselbe zu erreichen.

    
talemyn 08.08.2013 15:48
quelle
0
%Vor%

LIVE-DEMO

Der ^ in [id^=filtro] ist der "Beginnt mit" Selektor welcher match irgendein Element und welche ID beginnt mit filtro < br>

Lassen Sie uns nun ein wenig Regex verwenden, um die Nummer aus der ID abzurufen,
this.id.match(/\d+/); erhält den Namen "dieser geklickte Element-ID" und ruft alle Zahlen ab d+
Diese Nummer wird dann verwendet, um Ihren CLASS-Elementselektor zu finden.

    
Roko C. Buljan 08.08.2013 15:35
quelle