2017-06-17 5 views
-1

Ich bin neu bei Jquery und Javascript. Ich versuchte, this Beispiel zu ändern: w3schools, zum url von der Initiale zu ändern: www.w3schools.com zu der Sekunde an: www.w3schools.com/jquery und zurück zu der ursprünglichen, wenn man anklickt die Taste (so oft wie gewünscht), aber ich kann nicht herausfinden, wie es geht. Bitte fügen Sie den gesamten Code in die Antwort ein, es wird einfacher. Vielen Dank.Wie URL dynamisch mit JQuery ändern

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"> 
 
    </script> 
 
    <script> 
 
     $(document).ready(function(){ 
 
$("button").click(function(){ 
 
    $("#w3s").attr("href", "https://www.w3schools.com/jquery"); 
 
}); 
 
}); 
 
    </script> 
 
</head> 
 
<body> 
 
    <p> 
 
     <a href="https://www.w3schools.com" id="w3s"> 
 
      W3Schools.com 
 
     </a> 
 
    </p> 
 
    <button> 
 
     Change href Value 
 
    </button> 
 
    <p> 
 
     Mouse over the link (or click on it) to see that the value of the href attribute has changed. 
 
    </p> 
 
</body> 
 
</html>

+0

Zuerst Hover der Link sehen werden ... www.w3school.com .... nach auf die Schaltfläche Link ändern klicken .. Sie können es überprüfen –

+0

@Miguel By Antwort schien aus keinem Grund (* vielleicht von Bots *) downvoted, jedenfalls beantwortet es Ihre Frage. Die anderen Fragen kopieren nur den Code, den Sie gegeben haben, und fügen ihn in eine Antwort ein. –

+0

https://www.w3schools.com/code/tryit.asp?filename=FGOSUXX5HUOG –

Antwort

1

Zuerst Hover der Link sehen werden ... www.w3school.com .... nach Klick auf button Link ändern ... Sie können überprüfen, es mit hover der Link. Arbeit Link als eine toggle

https://www.w3schools.com/code/tryit.asp?filename=FGOSUXX5HUOG

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 

 
<p><a href="https://www.w3schools.com" id="w3s">W3Schools.com</a></p> 
 

 
<button>Change URL</button> 
 

 
<p>Mouse over the link (or click on it) to see that the value of the href attribute has changed.</p> 
 

 

 
<script> 
 
$(document).ready(function(){ 
 

 
    $("button").click(function(){ 
 
    
 
     var myURL = "https://www.w3schools.com"; 
 
     if($("#w3s").attr("href") === myURL) 
 
     $("#w3s").attr("href", "https://www.w3schools.com/jquery"); 
 
     else 
 
     $("#w3s").attr("href", myURL); 
 
    }); 
 
}); 
 
</script> 
 
</head> 
 
<body> 
 

 

 

 
</body> 
 
</html>

+0

https://www.w3schools.com/code/tryit.asp?filename=FGOSUXX5HUOG –

+2

Dies ist die fast genaue Antwort, die ich bereits gegeben habe. –

+0

Ja, es funktioniert gut ... Ich habe nachgesehen ... aber wer gibt dir die Stimme? Warte .. Ich gebe dir eine Stimme von meiner Seite :) –

1

Sie können nur eine einfache if-else verwenden und überprüfen Sie die href Attribut.

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 
<script> 
 
$(document).ready(function(){ 
 
    $("button").click(function(){ 
 
     var w3schoolURL = "https://www.w3schools.com"; 
 
     if($("#w3s").attr("href") === w3schoolURL) 
 
     $("#w3s").attr("href", "https://www.w3schools.com/jquery"); 
 
     else 
 
     $("#w3s").attr("href", w3schoolURL); 
 
    }); 
 
}); 
 
</script> 
 
</head> 
 
<body> 
 

 
<p><a href="https://www.w3schools.com" id="w3s">W3Schools.com</a></p> 
 

 
<button>Change href Value</button> 
 

 
<p>Mouse over the link (or click on it) to see that the value of the href attribute has changed.</p> 
 

 
</body> 
 
</html>

+0

Warum die Herabstufungen? Dies ist die einzig richtige Antwort ab sofort. –

+0

haben Sie diesen Code getestet? –

+0

@ Roxy'Pro Ja, es funktioniert gut. Sie können das Snippet ausführen und bestätigen, dass es nie ein Problem mit meiner Antwort gab. –

-1

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
 

 
<script> 
 
$(document).ready(function(){ 
 
\t var w3 = "https://www.w3schools.com"; 
 
\t var w3Jquery = "https://www.w3schools.com/jquery"; 
 
\t var toggleFlag = true; 
 
    $("button").click(function(){ 
 
     if(toggleFlag){ 
 
     \t $("#w3s").attr("href", w3Jquery); 
 
     } 
 
     else{ 
 
     \t $("#w3s").attr("href", w3); \t 
 
     } 
 
     toggleFlag = !toggleFlag; 
 
    }); 
 
}); 
 
</script> 
 

 
<body> 
 
<p><a href="https://www.w3schools.com" id="w3s">W3Schools.com</a></p> 
 

 
<button>Change href Value</button> 
 

 
<p>Mouse over the link (or click on it) to see that the value of the href attribute has changed.</p> 
 

 
</body>

Verwandte Themen