使用jQuery更改单选按钮选择上的标签文本

时间:2015-06-05 10:56:27

标签: javascript jquery html

当从"设置默认值"中选择时,我需要更改单选按钮上的标签文本。到"默认" - 如何用jQuery完成?我认为你会使用班级radio-default作为选择器,但我不太了解jQuery。



<div class="radio-default">
  <input type="radio" id="line-radio-1" name="line-radio">
  <label for="line-radio-1">Set default</label>           
</div>

<div class="radio-default">
  <input type="radio" id="line-radio-2" name="line-radio">
  <label for="line-radio-2">Set default</label>           
</div>

<div class="radio-default">
  <input type="radio" id="line-radio-3" name="line-radio">
  <label for="line-radio-3">Set default</label>           
</div>
&#13;
&#13;
&#13;

6 个答案:

答案 0 :(得分:2)

尝试

$("input[name='line-radio']").click(function() {
      $('.radio-default label').text('Set default');
      if(this.checked){
       $(this).next().text('default');
      }
 });

Fiddle

答案 1 :(得分:2)

使用以下脚本

 $( "input:radio" ).click(function() {
    $(':radio').each(function() {
        $("#"+this.id).next().text( "Set default" );
    });

    $("#"+this.id).next().text( "Default" );

});

答案 2 :(得分:0)

您可以在单选按钮

上添加on click hadler
<input type="radio" id="line-radio-1" name="line-radio" onClick="yourFunc">

yourFunc: function(e){
    $(e).next('label').text('your text');
}

答案 3 :(得分:0)

这样做: -

 var $radioButtons = $('.radio-default input:radio[name="line-radio"]');
 $radioButtons.change(function(){
    if($(this).val() == 'on'){
       $radioButtons.siblings('label').text('Set default');
       $(this).siblings('label').text('default')
    }
});

工作JsFiddle here

答案 4 :(得分:0)

您可能想要重置点击的上一个按钮上的文字,但这可以帮到您:

$('.radio-default').on('click',function(){
    $(this).find('label').text("set");
})

答案 5 :(得分:0)

试试这个

$('input:radio').click(function() {
   $('label').text('Set default');
   $(this).next('label').html('Default');
  });

http://jsfiddle.net/ph2gvjcc/