改变图例文字的字段集

-1

我在页面上有一组单选按钮。每个单选按钮加载不同的复选框。那么如何根据单选按钮选择来更改复选框的图例文本。改变图例文字的字段集

在下面的代码中，当我单击radiobutton1时，它将Station1加载为图例，并将showS1加载到复选框。如果我选择radionbutton2，它应该将图例文本更改为Station2并显示showS2复选框。

<html> 
    <head> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 

    <link href="static/css/app.css" rel="stylesheet"></link> 
    </head> 
<body ng-app="app" class="ng-cloak"> 

<div class="generic-container" ng-controller="GController as ctrl"> 

    <form class="form-inline"> 
    <fieldset class="scheduler-border"> 
    <legend class="scheduler-border">Select Station</legend> 

    <div class="form-group"> 

    <label class="radio-inline" > 
    <input id="inlineradio1" name="sampleinlineradio" value="showS1" type="radio" ng-model="radioption"> 
       Station 1</label> 

    <label class="radio-inline"> 
    <input id="inlineradio2" name="sampleinlineradio" value="showS2" type="radio" ng-model="radioption" > 
       Station 2</label> 
    </div>  
    </fieldset> 
    </form> 

    <form class="form-inline"> 
    <div class="form-group"> 
    <fieldset class="scheduler-border"> 
    <legend class="scheduler-border">Station 1</legend> 

    <div ng-show="radioption == 'showS1'"> 
    <label class="radio-inline"> 
    <input id="cb1" type="checkbox" name="cboption" ng-model="checkboxption" value="cb1show"> 
      BRW</label> 
    </div> 

    <div ng-show="radioption == 'showS2'"> 
    <label class="radio-inline"> 
    <input id="cb2" type="checkbox" name="cboption" ng-model="checkboxption" value="cb2show"> 
     LCBD</label> 
    </div> 
    </fieldset> 
    </form> 
    </div> 
</body> 
</html>

编辑：

给了传说的ID = A，并试图这样。但它不工作。请告诉我我做错了什么。

$(document).ready(function(){ 
      $("#inlineradio1").click(function(){ 
       $("#A").html("Station 1"); 
      }); 
    }); 
$(document).ready(function(){ 
      $("#inlineradio2").click(function(){ 
       $("#A").html("Station 2"); 
      }); 
    });

来源

2016-11-04 user3785322

哪里是你的js代码？ – Jigar7521

你应该总是发布完整的代码，人们应该能够重现/能够使用它。请考虑发布所有的作品 – Sreekanth

$(document).ready(function(){ 
 
    $('input[name="sampleinlineradio"]').click(function(){ 
 
     if($(this).attr("value")=="showS1"){ 
 
     $('.scheduler-s1, .station_brw').show(); 
 
     $('.scheduler-s2, .station_lcbd').hide(); 
 
     } 
 
     if($(this).attr("value")=="showS2"){ 
 
     $('.scheduler-s1, .station_brw').hide(); 
 
     $('.scheduler-s2, .station_lcbd').show(); 
 
     } 
 
    }); 
 
});

.station_lcbd, .scheduler-s2{ 
 
    display: none; 
 
}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script> 
 
<body ng-app="app" class="ng-cloak"> 
 

 
<div class="generic-container" ng-controller="GController as ctrl"> 
 

 
    <form class="form-inline"> 
 
    <fieldset class="scheduler-border"> 
 
    <legend class="scheduler-border">Select Station</legend> 
 

 
    <div class="form-group"> 
 

 
    <label class="radio-inline" > 
 
    <input id="inlineradio1" name="sampleinlineradio" value="showS1" type="radio" ng-model="radioption"> 
 
       Station 1</label> 
 

 
    <label class="radio-inline"> 
 
    <input id="inlineradio2" name="sampleinlineradio" value="showS2" type="radio" ng-model="radioption" > 
 
       Station 2</label> 
 
    </div>  
 
    </fieldset> 
 
    </form> 
 

 
    <form class="form-inline"> 
 
    <div class="form-group"> 
 
    <fieldset class="scheduler-border"> 
 
    <legend class="scheduler-s1">Station 1</legend> 
 
    <legend class="scheduler-s2">Station 2</legend> 
 

 
    <div ng-show="radioption == 'showS1'" class="station_brw"> 
 
    <label class="radio-inline"> 
 
    <input id="cb1" type="checkbox" name="cboption" ng-model="checkboxption" value="cb1show"> 
 
      BRW</label> 
 
    </div> 
 

 
    <div ng-show="radioption == 'showS2'" class="station_lcbd"> 
 
    <label class="radio-inline"> 
 
    <input id="cb2" type="checkbox" name="cboption" ng-model="checkboxption" value="cb2show"> 
 
     LCBD</label> 
 
    </div> 
 
    </fieldset> 
 
    </div> 
 
    </form> 
 
    </div> 
 
</body>

来源

2016-11-04 07:37:59 Venkatachalam

改变图例文字的字段集

回答

相关问题