jQuery是否将选择转换为单选按钮？

我正在尝试使用jquery动态地将选择框转换为单选按钮，但我不确定最好的方法

HTML示例：

  <form id="product">    
    <select name="data[123]">
      <option value="1">First</option>
      <option value="2">Second</option>
      ......
      <option value="n">xxxxxx</option>
    </select>
  </form>

---

有没有人尝试过这种方法，或者有一些我不知道的秘密/更简单的方法？

你走对了方向。迭代并将select数据收集到变量中，并尽可能少地进行DOM操作调用（为了提高效率）以创建无线电输入。

我将其放在一起，并在几个浏览器中进行了测试，似乎都能很好地处理它。它将从

元素中取出数据，并为每个元素创建

，然后删除选择框

//Get Exising Select Options    
$('form#product select').each(function(i, select){
    var $select = $(select);
    $select.find('option').each(function(j, option){
        var $option = $(option);
        // Create a radio:
        var $radio = $('<input type="radio" />');
        // Set name and value:
        $radio.attr('name', $select.attr('name')).attr('value', $option.val());
        // Set checked if the option was selected
        if ($option.attr('selected')) $radio.attr('checked', 'checked');
        // Insert radio before select box:
        $select.before($radio);
        // Insert a label:
        $select.before(
          $("<label />").attr('for', $select.attr('name')).text($option.text())
        );
        // Insert a <br />:
        $select.before("<br/>");
    });
    $select.remove();
});

//获取退出选择选项
$（'form#product select'）。每个（函数（i，select）{
变量$select=$（select）；
$select.find（'option'）。每个（函数（j，option）{
var$选项=$（选项）；
//创建一个收音机：
变量$radio=$（''）；
//设置名称和值：
$radio.attr（'name'，$select.attr（'name'））.attr（'value'，$option.val（））；
//如果选择了该选项，则设置为选中状态
if（$option.attr（'selected'））$radio.attr（'checked'，'checked'）；
//在选择框之前插入收音机：
$select.before（$radio）；
//插入标签：
$select.before(
$（“”）.attr（'for'，$select.attr（'name'））.text（$option.text（））
);
//插入一个
：
$select.before（“
”）；
});
$select.remove（）；
});

谢谢，但标签单击不起作用替换两行1:

$radio.attr（'name'，$select.attr（'name'））.attr（'id'，$option.val（））**2.*
$（“”）.attr（'for'，$option.attr（'value'））.text（$option.text（））
实际上第二行应该这样替换：
$（“”）.attr（'for'，$radio.attr（'id'））.text（$option.text（））
这个解决方案在做了一些小改动后对我来说非常有效：
$option.attr（'selected'）
需要是
$option.is（':selected'）
，因为我的下拉列表中没有任何带有所选属性的选项（第一个是预先选择的）。我还必须为单选按钮创建一个ID，以便for=”“可以工作<代码>$radio.attr（'id'），$select.attr（'id'）+'.'+$option.attr（'value'））一旦你的收音机有了自己的唯一ID，@Claudiu的建议就行了。就我而言，他们还没有自己的身份证。
$(document).ready(function(){

    //Get Exising Select Options    
    $('form#product select').each(function(i, select){
        $(select[i]).find('option').each(function(j, option){
            //alert($(option).text());
            option[j] = [];
            option[j]['text'] = $(option).text();
            option[j]['val'] = $(option).val();
        });
    });


    //Remove Select box
    $('form#product select').remove();
});

//Get Exising Select Options    
$('form#product select').each(function(i, select){
    var $select = $(select);
    $select.find('option').each(function(j, option){
        var $option = $(option);
        // Create a radio:
        var $radio = $('<input type="radio" />');
        // Set name and value:
        $radio.attr('name', $select.attr('name')).attr('value', $option.val());
        // Set checked if the option was selected
        if ($option.attr('selected')) $radio.attr('checked', 'checked');
        // Insert radio before select box:
        $select.before($radio);
        // Insert a label:
        $select.before(
          $("<label />").attr('for', $select.attr('name')).text($option.text())
        );
        // Insert a <br />:
        $select.before("<br/>");
    });
    $select.remove();
});