1

<select>外部 API を介して受け取る簡単なリストがありますが、これは変更できません。

<select>私の問題は次のとおりです。このリストを通常の html リンクの束に変換したいと考えています。では動作しない方法で CSS を使用してリストのスタイルを設定したい<select>。「display:none」で元のリストを非表示にします

これ：

<select style="display:none;">
  <option value="E1">Entry 1</option>
  <option value="E2">Entry 2</option>
  <option value="E3">Entry 3</option>
</select>

次のように変換する必要があります。

<a href="E1" class="X1">Entry 1</a>
<a href="E2" class="X2">Entry 2</a>
<a href="E3" class="X3">Entry 3</a>

どうすればこれを達成できますか?

私は解決策を見つけましたが、それは間違った方法です! リストから <select> を作成します - 子項目をインデントしますか?

4

1 に答える 1

1

ここに解決策があります。http://jsfiddle.net/C5S32/44/でテストできます。

var options = '';
$('select').find('option').each(function () {
    var
    val = $(this).val(),
    text = $(this).text(),
    i = 1;
    options += '<a href="' + val + '">' + text + '</a>';
});
$('<div class="test" />').append(options).appendTo('#selectnav');
于 2012-10-24T10:29:42.990 に答える