Jquery 在引导中单击单选按钮时如何显示/隐藏文本

我有两个单选按钮选择单位（厘米/英尺）。 如果我选择“cm”，文本将更改为cm

在引导中单击单选按钮时如何显示/隐藏文本

这里是我的示例代码

身体{
填充：50px；
}
.btn选择{边框：1px实心#333}
.btn-select.active{背景：#999}
厘米
厘米
在里面

请先包含jQuery脚本，然后使用此代码

<script src = "js/jquery-1.8.3.min.js"></script> //your jquery version

<script>
$(document).ready(function(){
     $('input[name=wrist]').on('change', function() {
         var _sel = $(this);
         $('span.unit').find('em').text(_sel.parent().text());
    })
});
</script>

//您的jquery版本
$（文档）.ready（函数（）{
$（'input[name=手腕]）。在（'change'，function（）上{
var_sel=$（本）；
$（'span.unit'）.find（'em'）.text（_sel.parent（）.text（））；
})
});

---

引导程序不会像那样进行自定义DOM操作。您需要使用一些基本的jQuery：

<span class="unit done">
  <input type="text" id="" name="" class="input1" value="" style="width:230px">
  <em>cm</em>
  <em style="display: none;">in</em>
</span>

<div class="btn-group btn-group-toggle unit-toggler pull-right" data-toggle="buttons">
  <label class="btn btn-select cm-unit active">  
    <input type="radio" name="wrist" id="wrist1" autocomplete="off" checked /> cm  
  </label>

  <label class="btn btn-select">
    <input type="radio" name="wrist" id="wrist2" autocomplete="off" /> in
  </label>
</div>


<script>
$('.unit-toggler input').change(function() {
  $('.unit em').toggle();
});
</script>

厘米
在里面
厘米
在里面
$（'.unit-toggler-input'）.change（function（）{
$（'.unit em'）.toggle（）；
});

---

您使用jQuery吗？我几乎认为应该使用引导输入组，并将选项放在文本框的末尾，同时去掉文本显示。使用选定的收音机作为显示屏。我们可以放心地假设，几乎任何引导站点都会加载jQuery。哦，如果我有多个无线组，我应该怎么做？因为问题是这会同时更改所有文本。您必须以某种方式将标记（类、ID、索引）和目标元素封装在该分组中，并使用任何有意义的选择器。熟悉jQuery元素选择器，世界就是您的牡蛎。

<span class="unit done">
  <input type="text" id="" name="" class="input1" value="" style="width:230px">
  <em>cm</em>
  <em style="display: none;">in</em>
</span>

<div class="btn-group btn-group-toggle unit-toggler pull-right" data-toggle="buttons">
  <label class="btn btn-select cm-unit active">  
    <input type="radio" name="wrist" id="wrist1" autocomplete="off" checked /> cm  
  </label>

  <label class="btn btn-select">
    <input type="radio" name="wrist" id="wrist2" autocomplete="off" /> in
  </label>
</div>


<script>
$('.unit-toggler input').change(function() {
  $('.unit em').toggle();
});
</script>