2017-02-04 2 views
0

Ich versuche, einen Weiterleitungslink mithilfe von Kontrollkästchen zu ändern, die an die URL angehängt werden, und eine Schaltfläche, die die geänderte URL verwendet. Ich bin immer noch ein Anfänger auf JavaScript und bin ein wenig verloren, wo ich falsch liege.Ändern Sie den Umleitungsstandort onClick.

Mein Code:

<html> 

<form> 

<div class="element1">" 
<input type="checkbox" name="name1" id="id1" value="val1" class="hidden" ></label></div> 

<div class="element2">" 
<input type="checkbox" name="name2" id="id2" value="val2" class="hidden" ></label></div> 

<div class="element3">" 
<input type="checkbox" name="name3" id="id3" value="val3" class="hidden" ></div> 


<div class="element00"> 
<input type="button"onclick="myFunction(calculatedUrl());" name="button1" id="itemA" value="valA" ></label></div> 

</form> 

<script> 
function calculatedUrl(){ 
    var totalString="" 
    var link1="some text" 
    var link2="more text" 
    var link3="something else" 

    if(document.getElementById("id1").checked == true){ 
    var totalString = totalString.concat(link1); 

} 

if(document.getElementById("id2").checked == true){ 
     var totalString = totalString.concat(link2); 


} 

if(document.getElementById("id3").checked == true){ 
     var totalString = totalString.concat(link3); 

} 
    return totalString 

} 

function myFunction(id){ 
var original="http://myoriginalurl" 
var addition=id 
var new=original.concat(addition) 




//for testing 
    window.alert(new) 

    document.getElementById("test1").innerHTML= new; 


//for the real redirecting not active for now 
//window.location=new 
          } 




</script> 


</html> 

Antwort

0

<html> 
 

 
<form> 
 

 
<div class="element1">" 
 
<input type="checkbox" name="name1" id="id1" value="val1" class="hidden" ></label></div> 
 

 
<div class="element2">" 
 
<input type="checkbox" name="name2" id="id2" value="val2" class="hidden" ></label></div> 
 

 
<div class="element3">" 
 
<input type="checkbox" name="name3" id="id3" value="val3" class="hidden" ></div> 
 

 

 
<div class="element00"> 
 
<input type="button"onclick="myFunction(calculatedUrl());" name="button1" id="itemA" value="valA" ></label></div> 
 

 
</form> 
 

 
<script> 
 
function calculatedUrl(){ 
 
    var totalString="" 
 
    var link1="some text" 
 
    var link2="more text" 
 
    var link3="something else" 
 

 
    if(document.getElementById("id1").checked == true){ 
 
    var totalString = totalString.concat(link1); 
 

 
} 
 

 
if(document.getElementById("id2").checked == true){ 
 
     var totalString = totalString.concat(link2); 
 

 

 
} 
 

 
if(document.getElementById("id3").checked == true){ 
 
     var totalString = totalString.concat(link3); 
 

 
} 
 
    return totalString 
 

 
} 
 

 
function myFunction(id){ 
 
var original="http://myoriginalurl" 
 
var addition=id 
 
console.log(id); 
 
var n =original.concat(addition) 
 

 

 

 

 
//for testing 
 
    window.alert(n) 
 

 
    document.getElementById("test1").innerHTML= n; 
 

 

 
//for the real redirecting not active for now 
 
//window.location=new 
 
          } 
 

 

 

 

 
</script> 
 

 

 
</html>

in Ihrem Code ändern die unten new-newurl - new ist ein reserviertes Wort.

function myFunction(id){ 
var original="http://myoriginalurl" 
var addition=id 
var newurl =original.concat(addition) 
//for testing 
window.alert(newurl) 
document.getElementById("test1").innerHTML= newurl; 
//for the real redirecting not active for now 
//window.location=new 
} 

ich nicht einen Tag mit id=test1 sehen, so dass Sie null Ausnahme in der Konsole Browser bekommen. Fügen Sie ein Tag basierend darauf hinzu und testen Sie es.

Ich habe ein Snippet hinzugefügt, bitte überprüfen.

+0

Ich änderte neu keine Änderung newURL aber immer noch. Warnung wird nicht angezeigt und der Absatz wird nicht aktualisiert. –

+0

Ich habe ein Snippet hinzugefügt, bitte klicken Sie auf ValA Button Sie erhalten die Warnung – Thennarasan

+0

Ich habe einen Absatz mit der ID = Test1 Ich habe gerade vergessen, es in den Fragecode einzufügen. Es scheint so, als würde myFunction überhaupt nicht laufen. es bricht irgendwo in calculatedUrl(). Danke für Ihre Hilfe! –

0

<html> 
 

 
<form> 
 

 
<div class="element1">" 
 
<input type="checkbox" name="name1" id="id1" value="val1" class="hidden" ></label></div> 
 

 
<div class="element2">" 
 
<input type="checkbox" name="name2" id="id2" value="val2" class="hidden" ></label></div> 
 

 
<div class="element3">" 
 
<input type="checkbox" name="name3" id="id3" value="val3" class="hidden" ></div> 
 

 

 
<div class="element00"> 
 
<input type="button"onclick="myFunction(calculatedUrl());" name="button1" id="itemA" value="valA" ></label></div> 
 

 
</form> 
 

 
<script> 
 
function calculatedUrl(){ 
 
    var totalString="" 
 
    var link1="some text" 
 
    var link2="more text" 
 
    var link3="something else" 
 

 
    if(document.getElementById("id1").checked == true){ 
 
    var totalString = totalString.concat(link1); 
 

 
} 
 

 
if(document.getElementById("id2").checked == true){ 
 
     var totalString = totalString.concat(link2); 
 

 

 
} 
 

 
if(document.getElementById("id3").checked == true){ 
 
     var totalString = totalString.concat(link3); 
 

 
} 
 
    return totalString 
 

 
} 
 

 
function myFunction(id){ 
 
var original="http://myoriginalurl" 
 
var addition=id 
 
console.log(id); 
 
var n =original.concat(addition) 
 

 

 

 

 
//for testing 
 
    window.alert(n) 
 

 
    document.getElementById("test1").innerHTML= n; 
 

 

 
//for the real redirecting not active for now 
 
//window.location=new 
 
          } 
 

 

 

 

 
</script> 
 

 

 
</html>