单选按钮组显示所选值 jQuery 上的项目

radio group show items on selected value jQuery

本文关键字：jQuery 项目 显示 单选按钮      更新时间：2023-09-26

有一个无线电组在更改时想要显示 arrt 包含所选无线电值的标签，这是我的代码 

<label class="radio"><input name="tour_type" type="radio" value="reg" />Regular</label>
<label class="radio"><input type="radio" name="tour_type" value="div" />Diving</label>
<label class="radio"><input type="radio" name="tour_type" value="qud"  />Quad</label>
<label class="radio"><input type="radio" name="tour_type" value="prv" />Privat</label>
<label class=" priceswrapper" style="display:none;" tour_type="reg, div">Pax<input type="text" /></label>
<label class=" priceswrapper" style="display:none;" tour_type="reg, div">Kids<input type="text" /></label>
<label class=" priceswrapper" style="display:none;" tour_type="reg, div">Intro Dive<input type="text" /></label>
<label class=" priceswrapper" style="display:none;" tour_type="reg, div">Professional Dive<input type="text" /></label>
<label class=" priceswrapper" style="display:none;" tour_type="qud">Single quad<input type="text" /></label>
<label class=" priceswrapper" style="display:none;" tour_type="qud">Doubble quad<input type="text" /></label>
<label class=" priceswrapper" style="display:none;" tour_type="qud">Private quad<input type="text" /></label>
<label class=" priceswrapper" style="display:none;" tour_type="prv">Private<input type="text" /></label>

这是我的jQuery代码 

$('input[name=tour_type]').change(function(){
        var tour_type= $(this).val();
        $('.priceswrapper', function(){
            var prices_attr = [$(this).attr('tour_type')];
            if ($.inArray(tour_type, window.prices_attr) !== -1){
                $(this).show();
                }

            });
        });

试试这个：在更改单选按钮时，使用.filter()遍历所有priceswrapper。检查 tour_type 的值，如果存在，则使用 .show() 使其可见 

$(function(){
  $('input[name=tour_type]').change(function(){
       var tour_type= $(this).val();
    $('.priceswrapper').hide();
    $('.priceswrapper').filter(function(){
       var tourType = $(this).attr('tour_type');
       return tourType.indexOf(tour_type)!=-1;
    }).show();
  });
});

演示

试试这个：-

$('input[name=tour_type]').change(function(){
    var tour_type= $(this).val();
    var divs = $('.priceswrapper')
    $.each(divs, function(index,item){
        if($(item).attr('tour_type').split(',').indexOf(tour_type)){
        $(item).show();
        }else{
         $(item).hide();
        }
        });
    });

演示 ：- http://jsfiddle.net/shrshcqn/

相关文章：