Variablen aus Link mit JS Ajax übergeben

[Toeb]

Hallo zusammen,

ich habe ein Seite, auf der mehrere Bereiche neu geladen werden sollen können ;-)

Dafür gibt es jeweils Links die Variablen beinhalten, in etwas so href="index.php?key1=wert1&key2=wert2&div-container=3"
Wenn man klickt, soll eine Seite geladen werden und der neue Inhalt eines bestehendes divs überschrieben werden.

Ich habe bisher dies:

$document.ready(function() {

var wert1 = Number();
var wert2 = Number();
var div-container = String();

 $.ajax({
        url:"data.php",
        type: "POST",
        data:{wert1:wert1, wert2:wert2},
        success:function(data)
        {
             $('div-container').html(data);
        }
      });
}

ich denke der Code ist selbsterklärend, oder? Ich benötige die Variablen aus dem Link, um sie dann in dem kleinen Script zu verarbeiten.

Kann mir dabei jemand behilflich sein?

Ich wünsche noch einen angenehmen Sonntag.

Liebe Grüße, Toeb

[Christian Marquardt]

para = new URLSearchParams(window.location.search);
key1 = para.get('key1');

[Toeb]

Danke für die Antwort.

Ich wollte es mal testen, leider ohne Erfolg

Ich habe folgendes zum testen gebastelt, zu diesem Link -> href="index.php?key1=wert1&key2=wert2&div-container=3" class="test"

$document.ready(function() {  

para = new URLSearchParams(window.location.search);
let key1 = para.get('key1');
let key2 = para.get('key2');
let dicontainer = para.get('div-container');  

$('.test').click(function(){                  

alert(key1);

}) }

Funktioniert leider nicht. Es kommt immer NULL als alert und nicht "wert1". Da ich Anfänger in JS bin, fehlt sicher noch etwas, aber ich brauche da leider noch etwas Unterstützung.

[Christian Marquardt]

    
            let startTime;
            let zeitraum = "";
            $(document).ready(function () {
                startTime = new Date().getTime();
                para = new URLSearchParams(window.location.search);
                zeitraum = para.get('zeitraum');
                if (zeitraum !== null && zeitraum !== "") {

funktioniert hier einwandfrei
Prüfe was bei dir in window.location.search steht
alert(window.location.search);

Das ist Code, wenn die aktuelle Seite mit index.php?key1=wert1&key2=wert2&div-container=3 class="test aufgerufen wurde.
Wenn du irgendwo einen String in der o.a. Form hast, dann new URLSearchParams(<String>);

[Toeb]

Da steht der erste Wert, welcher in der URL in der Adressleiste zu finden ist.
Ich glaube das ist der falsche Ansatz.

Ich möchte ja nicht die URL in der Adressleiste auslesen, sondern mit klick auf einen Link Werte aus diesem Link an JS übergeben, damit die richtigen Inhalte per Ajax nachgeladen werden.
Es muss halt dynamisch sein, weil verschiedene Links auf der Seite dynamisch zusammengesetzt werden, daher müssen immer die Werte aus dem Link mit übergeben werden.

Im Prinzip etwas wie LINKSearchParams ;-)

Schon einmal lieben Dank für die Unterstützung.

[Christian Marquardt]

Deine Links mit einem onclick-Ereignis verbinden

$("<DEIN_SELEKTOR_FÜR_LINKS>").click(function () {
  var href=$(this).attr("href");
  para = new URLSearchParams(href);
  key1 = para.get('key1');
  return false;
});

[Toeb]

Funktioniert!

Super, ich danke allen für die Unterstützung und dass ich wieder etwas lernen konnte. :-)

[Toeb]

Eine Nachfrage habe ich jetzt doch noch.

Wie verhält sich das ganze mit einem Button und Value?

<button class="test" value="wert"> </button>

[Christian Marquardt]

var val=$(this).val();

[Toeb]

Lieben Dank