URL Abfrage in Jquery?

shinun

Mitglied
Hallo,

ich habe folgendes Problem. Ich möchte, dass ein tab in Bootstrap ausgewählt wird, wenn ich auf einer bestimmten URL bin.

Wenn zum Beispiel diese URLS abgerufen werden:
www.xxxx.de/thema1
www.xxxx.de/thema2
www.xxxx.de/thema3
www.xxxx.de/thema4
www.xxxx.de/thema5

Soll das "profile-tab" geöffnet sein.

Wäre super, wenn ihr mir da helfen könntet.

HTML:
<ul class="nav nav-tabs" id="myTab" role="tablist">
    <li class="nav-item">
        <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true">Home</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" id="profile-tab" data-toggle="tab" href="#profile" role="tab" aria-controls="profile" aria-selected="false">Profile</a>
    </li>
    <li class="nav-item">
        <a class="nav-link" id="contact-tab" data-toggle="tab" href="#contact" role="tab" aria-controls="contact" aria-selected="false">Contact</a>
    </li>
</ul>
<div class="tab-content" id="myTabContent">
    <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">...</div>
    <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">...</div>
    <div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">...</div>
</div>

<script>

    $('#myTab a').on('click', function (e) {
        e.preventDefault()
        $(this).tab('show')
    })
</script>
 
Wie soll das gehen? Die url verweist auf verschiedene Seiten, damit werden auch verschiedene Seiten geladen. Du könntest jetzt einen Riesen Fusch machen und die Seiten alle erstellen und dort immer das gleiche reinschreiben aber ich glaube das was du eigentlich willst wäre sowas wie

www.xxx.de?thema=1
www.xxx.de?thema=2

etc
Das Ganze soll ja ein Menü sein. Es muss doch irgendwie gehen, dass man die Parameter in den URLS auslesen kann und sagen kann, Tab X sei offen, wenn Parameter Y in den URLs vorhanden ist?
 
Klar geht das. Du kannst z. B. serverseitig URLs, die einem bestimmten Muster folgen, mit dem selben Inhalt beantworten. Du kannst wie von @Thallius vorgeschlagen aber auch Query-Paramter oder aber auch Fragmente verwenden, dann brauchst Du am Server nichts rumzustellen. Clientseitig musst Du halt window.location bzw. window.location.hash auswerten, bei Query-Parameter würde ich window.location.search im Zusammenhang mit URLSearchParams verwenden.
 
Klar geht das. Du kannst z. B. serverseitig URLs, die einem bestimmten Muster folgen, mit dem selben Inhalt beantworten. Du kannst wie von @Thallius vorgeschlagen aber auch Query-Paramter oder aber auch Fragmente verwenden, dann brauchst Du am Server nichts rumzustellen. Clientseitig musst Du halt window.location bzw. window.location.hash auswerten, bei Query-Parameter würde ich window.location.search im Zusammenhang mit URLSearchParams verwenden.
Ich hatte bis jetzt hauptsächlich leider nur mit HTML und CSS zu tun und verstehe daher recht wenig von deiner Antwort, aber trotzdem danke. Ich werde mich da mal reinlesen
 
Ich hatte bis jetzt hauptsächlich leider nur mit HTML und CSS zu tun und verstehe daher recht wenig von deiner Antwort, aber trotzdem danke. Ich werde mich da mal reinlesen
Das hat auch nichts mit HTML und CSS zu tun 🙂 Öffne mal die Entwicklertools im Browser (F12), geh in die Konsole und tipp mal window.location ein, dann erscheint eine URI der Form https://www.java-forum.org/thema/url-abfrage-in-jquery.190004/#post-1237766. Wenn Du window.location.hash eintippst, bekommst Du nur den Part #post-1237766.

Wenn die URL so aussehen würde: https://www.java-forum.org/thema/url-abfrage-in-jquery.190004?q=1237766&v=a, dann gäbe es einen Abfrageparameter q mit dem Wert 1237766 und einen Parameter v mit dem Wert a. An die Parameter kommst Du per:
Javascript:
let params = new URLSearchParams(window.location.search.substring(1));
params.get("q")
params.get("v")
 

Zurück
Oben