使用jquery更新下拉选择单选按钮选择 [英] Update drop down selection with radio button selection using jquery

问题描述

因此，这是此帖子的后续行动。 。我需要用单选按钮替换一些下拉菜单而不修改HTML。在之前我链接的文章中，有人提出了一个非常聪明的Jquery解决方案，它可以用单选按钮成功替换下拉菜单，并在选中某个单选按钮时更新下拉选择。然而，当我使用插件实现它时，会出现单选按钮，但它们在选择时不会更新下拉列表的值。我怀疑在页面上的其他地方与js有冲突，但经过一些试验和错误之后，我仍然无法弄清楚发生了什么事情。有任何想法吗？相关网站可以此处

这是以前的帖子原创解决方案

所以这是更新的代码：

 < script type ='text /的javascript> 
 $（function（）{
 $（＃options-1 option）。each（function（i，e）{
 $（< input type ='radio'name ='r'/>）
 .attr（value，$（this）.val（））
 .attr（checked，i == 0）
。点击（函数（）{
 $（＃options-1）.val（$（this）.val（））; 
}）
 .appendTo（＃r） ; 
 $（＃options-1）。change（function（）{
 $（input [name ='r'] [value ='+ this.value +']） .attr（checked，checked）; 
}）; 
}）; 
}）; 
< / script> 
  

解决方案

代码

  $（＃d）。change（function（）{
 $（input [name = 'r'] [value ='+ this.value +']）。attr（checked，checked）; 
}）; 
  

So this is a follow up to this post. I need to replace some dropdown menus with radio buttons without modifying the HTML. In the post I linked earlier, someone came up with a really clever Jquery solution that successfully replaces the dropdown menu with radio buttons and updates the dropdown selection when one of the radio buttons is selected.

However, when I implemented it with the plugin, the radio buttons appear but they don't update the drop down's value when selected. I suspect there is some conflict with js elsewhere on the page but after some trial and error, I still can't figure out whats going on. Any ideas? The site in question can be found here

Here is the original solution from the earlier post

So here is the updated code:

<script type='text/javascript'> 
    $(function(){
    $("#options-1 option").each(function(i, e) {
        $("<input type='radio' name='r' />")
        .attr("value", $(this).val())
        .attr("checked", i == 0)
        .click(function () {
            $("#options-1").val($(this).val());
        })
        .appendTo("#r");
       $("#options-1").change(function(){
       $("input[name='r'][value='"+this.value+"']").attr("checked","checked");
});
});
});
</script> 

解决方案

You need to have this function in addition to your existing code

$("#d").change(function(){
    $("input[name='r'][value='"+this.value+"']").attr("checked","checked");
});

这篇关于使用jquery更新下拉选择单选按钮选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！