2016-05-09 4 views
1

Ich versuche, einen Link zu machen, der Adressen basierend auf der Eingabe von Radio-Buttons ändert, aber der Code, den ich jetzt nur den ersten Radio-Button ignoriert.jQuery Stapeln Radio-Tasten

var mwc1 = $("#mwc1").is(":checked"); 
var mwc2 = $("#mwc2").is(":checked"); 
var mwv2 = $("#mwv2").is(":checked"); 
var mbc2 = $("#mbc2").is(":checked"); 
var addr = ""; 
if (mwc1) { 
    if (mwc2) {addr = "1";} 
    else if (mwv2) {addr = "2";} 
    else if (mbc2) {addr = "3";} 
} 
$("#checkout a").attr('href', addr); 

Hier ist eine Beschreibung des gesamten Codes. Vielen Dank! https://jsfiddle.net/a2Lkgua3/2/

+0

hilft haben Sie einige ernsthaft verwirrende Variablennamen. – DBS

Antwort

1

In Ihrem JS fummeln Sie die Variablennamen

sind die Wiederverwendung von
var mwc1 = $("#mwc1").is(":checked"); 
var mwv1 = $("#mwv1").is(":checked"); 
var mbc1 = $("#mbc1").is(":checked"); 
var mwc1 = $("#mwc2").is(":checked"); 
var mwv1 = $("#mwv2").is(":checked"); 
var mbc1 = $("#mbc2").is(":checked"); 

Ich nehme an, das ein Tippfehler ist und Sie wollten eigentlich:

var mwc1 = $("#mwc1").is(":checked"); 
var mwv1 = $("#mwv1").is(":checked"); 
var mbc1 = $("#mbc1").is(":checked"); 
var mwc2 = $("#mwc2").is(":checked"); 
var mwv2 = $("#mwv2").is(":checked"); 
var mbc2 = $("#mbc2").is(":checked"); 
0

Ich weiß, dass dies beantwortet wird, sondern versuchen, die folgende, sollte es Sie viel Code sparen:

$('input[type="radio"]').click(function() { 
 
    $("#checkout a").attr('href', $(this).data('val')); 
 
    alert($("#checkout a").attr('href')); 
 
    
 
});
a#checkoutbtn{ 
 
\t \t background: #ECECEC; 
 
\t \t padding: 20px 37px; 
 
\t \t display: block; 
 
\t \t color:#7f7f7f; 
 
     width: 145px; 
 
\t \t margin:50px auto; 
 
\t \t margin-top:100px; \t 
 
     text-align:center; 
 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 

 
<ul> 
 
     <li> 
 
      <input type="radio" id="mwc1" name="ms1selector" data-val = 1> 
 
      <label for="mwc1">yahoo</label> 
 
     </li> 
 
    </ul> 
 
    <ul> 
 
     <li> 
 
      <input type="radio" id="mwv1" name="ms1selector" data-val = 2> 
 
      <label for="mwv1">apple</label> 
 
     </li> 
 
    </ul> 
 
    <ul> 
 
     <li> 
 
      <input type="radio" id="mbc1" name="ms1selector" data-val =3> 
 
      <label for="mbc1">bing</label> 
 
    </li> 
 
     </ul> 
 
     <br/><br/><br/> 
 
     <ul> 
 
     <li> 
 
      <input type="radio" id="mwc2" name="ms2selector"data-val =4> 
 
      <label for="mwc2">yahoo</label> 
 
     </li> 
 
    </ul> 
 
    
 
    <ul> 
 
     <li> 
 
      <input type="radio" id="mwv2" name="ms2selector"data-val =5> 
 
      <label for="mwv2">apple</label> 
 
     </li> 
 
    </ul> 
 
    <ul> 
 
     <li> 
 
      <input type="radio" id="mbc2" name="ms2selector"data-val =6> 
 
      <label for="mbc2">bing</label> 
 
    </li> 
 
     </ul> 
 
     
 

 
    <div id="checkout"> 
 
     <a id="checkoutbtn" href="www.google.com" > Button </a> 
 
    </div>

Hoffe, dass es