动态选择选项单选按钮

选中的每个单选按钮都有其自己的选择选项，请参阅下面的我的代码。动态选择选项单选按钮

使用jQuery，请有人帮我让它工作？

<HEAD> 

<script type="text/javascript" src="jquery-1.8.3.min.js"></script> 
<script type="text/javascript"> 

    $('#machines input:radio').change(function() { 

     var selectedVal = $("#machines input:radio:checked").val(); 
     if(1 == selectedVal){ 
      var bikeList = '<select name="Bikes"><option>Ducati</option><option>Kawasaki</option></select>'; 
      $('select').remove(); 
      $('#selectList').append(bikeList); 
     }else if(2 == selectedVal){ 
      var carList = '<select name="Cars"><option>Audi</option><option>Nissan</option></select>'; 
      $('select').remove(); 
      $('#selectList').append(carList); 
     } 

    }); 
</script> 

</HEAD> 

<BODY> 
    <div id="machines"> 
    <input type="radio" name="category" value="1" />Bikes 
    <input type="radio" name="category" value="2" />Cars 
    </div> 
    <div id="selectList"></div> 

</BODY>

来源

2013-01-01 blsn

什么是你想达到的脚本？ – undefined

选定的单选按钮将显示其对应的下拉框。 – blsn

你应该把你的代码放在文档就绪处理程序中，注意:radio选择器已被弃用。

$(document).ready(function(){ 
    var $list = $('#selectList'); // you can cache the object for better performace 
    $('#machines input[type=radio]').change(function() { 
     var selectedVal = this.value; // you can use `this` which refers to the currect input 
     if (1 == selectedVal) { 
      var bikeList = '<select name="Bikes"><option>Ducati</option><option>Kawasaki</option></select>'; 
      $list.html(bikeList); 
     } else if (2 == selectedVal) { 
      var carList = '<select name="Cars"><option>Audi</option><option>Nissan</option></select>'; 
      $list.html(carList); 
     } 
    }); 
});

来源

2013-01-01 14:57:59 undefined

那么，还有其他的东西，我们可以修复的设计。但是我认为，如果我尽可能少地改变代码以使其工作，那么学习起来会更容易。请享用。

<HEAD> 

<script type="text/javascript" src="jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() { 
    $('#machines input:radio').change(function() { 
     var selectedVal = $("#machines input:radio:checked").val(); 
     if(1 == selectedVal){ 
     var bikeList = '<select name="Bikes"><option>Ducati</option><option>Kawasaki</option></select>'; 
     $('#selectList').html(bikeList); 
     }else if(2 == selectedVal){ 
     var carList = '<select name="Cars"><option>Audi</option><option>Nissan</option></select>'; 
     $('#selectList').html(carList); 
     } 

    }); 
}); 
</script> 

</HEAD> 

<BODY> 
    <div id="machines"> 
    <input type="radio" name="category" value="1" />Bikes 
    <input type="radio" name="category" value="2" />Cars 
    </div> 
    <div id="selectList"></div> 

</BODY>

来源

2013-01-01 15:00:18 Boon

使用

$(document).ready(function(){ 
// your code here 
});

或将在2个单选按钮

<HEAD> 
<script type="text/javascript" src="jquery-1.8.3.min.js"></script> 
</HEAD> 

<BODY> 
    <div id="machines"> 
    <input type="radio" name="category" value="1" />Bikes 
    <input type="radio" name="category" value="2" />Cars 
    </div> 
    <div id="selectList"></div> 


<script type="text/javascript"> 
    $('#machines input:radio').change(function() { 
     var selectedVal = $("#machines input:radio:checked").val(); 
     if(1 == selectedVal){ 
      var bikeList = '<select name="Bikes"><option>Ducati</option><option>Kawasaki</option></select>'; 
      $('select').remove(); 
      $('#selectList').append(bikeList); 
     }else if(2 == selectedVal){ 
      var carList = '<select name="Cars"><option>Audi</option><option>Nissan</option></select>'; 
      $('select').remove(); 
      $('#selectList').append(carList); 
     } 
    }); 
</script> 

</BODY>

来源

2013-01-01 15:01:15 phnkha

动态选择选项单选按钮

回答

相关问题