Question

如何使用jQuery更改单选按钮的复选框？

Answer 1

var checkbox = $("#myCheckbox");
checkbox.replaceWith('<input type="radio" name="'+checkbox.attr('name')+'" value="'+checkbox.attr('value')+'" />');

或者使用jQuery 1.4

var checkbox = $("#myCheckbox");
$("<input>",{
    type:'radio',
    name: checkbox.attr('name'),
    value: checkbox.attr('value')
}).replace(checkbox);

您更改了type属性，因为它会在IE中导致问题。

Answer 2

下式给出：

<input type="checkbox" name="change" id="change">
<label for="changem">Change Buttons</label><br><br>
<div id="btngroup">
<span><input type="radio" name="btngroup" id="btn-1"></span>
<label for="btn-1">Button 1</label><br>
<span><input type="radio" name="btngroup" id="btn-2"></span>
<label for="btn-2">Button 2</label><br>
<span><input type="radio" name="btngroup" id="btn-3"></span>
<label for="btn-3">Button 3</label><br>
</div>

jQuery的：

$(document).ready(function() {
  $('#change').click(function() {
    if( $('#change:checked').length > 0 ) {
      var myType = "checkbox";
    }  else {
      var myType = "radio";
    }
     $("#btngroup span").each(function(i) {
     $(this).html('<input type="' + myType + '" name="btngroup" id="btn-' + (i+1) + '">');
    });
  });
});

DEMO

Answer 3

我认为您无法更改类型属性。

作为替代方案，您可以使用div：一个用于复选框，另一个用于无线电。并使用show() / hide()方法...

如何使用jQuery更改单选按钮的复选框？

3 个答案: