Jqueryは変数とラジオボタンからリンクを生成します

Question

Iveは重要な質問を受けました。私はハイパーリンクを生成したい。ここ は一例です：

Radio group one: 
[X] Black 
[ ] White 
Radio group two: 
[ ] Black 
[X] White 
[ ] Yellow 
Radio group three: 
[ ] Black 
[ ] White 
[X] Red 

これは、結果、次のようになります。

<a href="www.example.de/example/BLACK-SITE/WHITE-SITE/RED-SITE">My generated Link</a> 

私はあなたが私は:)は、この問題を解決する方法任意のアイデアを得るために素晴らしいことだ何を意味するかを理解してほしいです。 、ニコールありがとうよろしく:)

ここ

これまでのところ、私のコードです：

 <script> 

    $(document).ready(function(){ 



    $('#back1').change(function(){ 
     if(this.checked) 
      $('#backimg1').show(); 
      $('#backimg2').hide(); 
      var back = '/schwarz-17'; 

    }); 

    $('#back2').change(function(){ 
     if(this.checked) 
      $('#backimg1').hide(); 
      $('#backimg2').show(); 
      var back = '/weiss-18'; 

    });  



    $('#front1').change(function(){ 
     if(this.checked) 
      $('#frontimg1').show(); 
      $('#frontimg2').hide(); 
      $('#frontimg3').hide(); 
      var back = '/teil-21'; 

    }); 

    $('#front2').change(function(){ 
     if(this.checked) 
      $('#frontimg1').hide(); 
      $('#frontimg2').show(); 
      $('#frontimg3').hide(); 
      var back = '/halb-23'; 

    }); 

    $('#front3').change(function(){ 
     if(this.checked) 
      $('#frontimg1').hide(); 
      $('#frontimg2').hide(); 
      $('#frontimg3').show(); 
      var back = '/ganz-26'; 
    }); 
}); 



<a id="link" onclick="location.href=this.href+'?key='+back+front;return false;" href ="http://www.tronitechnik.de/duschen"> 

Answer 1

あなたはrespectivesのidを持つ3ラジオボックスを使用している場合：Radio1の、radio2、radio3：

$(document).ready(function(){ 

var link1 = "default1" ; 
var link2 = "default2" ; 
var link3 = "default3" 
var baseLink = "www.example.de/example/" ; 
var finalLink ; 

$('#radio1').on('change', function() { 
    link1 = $(this).val(); 
    changeLink(); 
}); 

$('#radio2').on('change', function() { 
    link2 = $(this).val(); 
    changeLink(); 
}); 

$('#radio3').on('change', function() { 
    link3 = $(this).val(); 
    changeLink(); 
}); 

function changeLink(){ 
    finalLink = baseLink + link1 + "/" + link2 + "/" + link3 ; 
    $("#link").attr("href",finalLink); 
} 

} 

私は$("#link").attr("href",finalLink);