0

クリック可能なラジオ ボタンに変更したいオプションの選択リストがあります。

ここに私の選択リストがあります：

<select id="VariationGroup44" class="select" name="dlVariationGroup44">
<option value="Select Color"> Select Color </option>
<option selected="selected" value="1"> Black </option>
<option value="2"> Red </option>
<option value="3"> Green </option>
<option value="4"> Blue </option>
</select>

これを UL に変換することに成功しましたが、オプションをクリックできなくなったため、ラジオ ボタンの方がうまく機能すると考えました。すべての提案を歓迎し、非常に感謝しています!

4

2 に答える 2

2

ワークフロー:

  1. オプションを繰り返します。
  2. あなたが必要なものを取る
  3. 新しいチェックボックスを作成します。
  4. それらを要素に追加します。

コード：

$('#VariationGroup44 option').each(function(i,obj){
  $('<li><input type="radio" name="chkOpt'+i+'" value="'+$(obj).val()+'"/><label for="chkOpt'+i+'"> '+$(this).text()+'</label></li>').appendTo('ul');
});

動作中の jsFiddle。

于 2012-08-28T02:39:22.727 に答える
0 
function replaceSelect(select) {
  var opts = $(select).find('option');
  var name = $(select).attr('name');
  var id = $(select).attr('id');
  var list = [];
  opts.each(function() {
    list.push(
      '<li>'+
        '<label>'+
          '<input type="radio" name="'+ name +'">'+ 
          $(this).text()
        '</label>'+
      '</li>'
    );
  });
  $(select).replaceWith('<ul id="'+ id +'">'+ list.join('') +'</ul>');
}

// Usage
replaceSelect('#VariationGroup44');
于 2012-08-28T02:37:05.273 に答える