0

スクリプトを使用して、UL を選択ドロップダウン ボックスに変換しています。

$(function() {
$('ul.cat-nav').each(function() {
    var $select = $('<select id="category" />');
    $(this).find('a').each(function() {
        var $option = $('<option />');
        $option.attr('value', $(this).attr('href')).html($(this).html());
        $select.append($option);
    });
    $(this).replaceWith($select);
    });
});

これはうまく機能しますが、最初のオプションとして「Choose One」の初期オプションを追加したいと思います。このコードを上記に追加すると、初期オプションは追加されません。

$("#category").html("<option value='#'>Choose One</option>");

私が間違っていることについて何か提案はありますか？

4

4 に答える 4

2

<option>解決策は、残りのオプションを追加する前に「1 つ選択」を追加することです。

コードを変更して、追加した行を含めます。

$(function() {
$('ul.cat-nav').each(function() {
    var $select = $('<select id="category" />');

    $select.append("<option value='#'>Choose One</option>");

    $(this).find('a').each(function() {
        var $option = $('<option />');
        $option.attr('value', $(this).attr('href')).html($(this).html());
        $select.append($option);
    });
    $(this).replaceWith($select);
    });
});

たとえば、この jsfiddle を参照してください。

于 2012-08-17T13:43:18.953 に答える
1

ペドロは確かに正しいです。別の JQuery メソッドを使用する必要があるという理由を追加するだけです。

.html() は、選択された HTML オブジェクトのコンテンツを置き換えますが、.prepened() は、選択された項目の前にデータを追加します (これが必要です)。

http://api.jquery.com/html/

http://api.jquery.com/prepend/

于 2012-08-17T13:44:10.237 に答える
1

使ってみて

$("#category").prepend("<option value='#'>Choose One</option>");
于 2012-08-17T13:36:05.400 に答える
1

交換

var $select = $('<select id="category" />');

と

var $select = $('<select id="category"><option value="#">Choose One</option></select>');
于 2012-08-17T13:37:47.040 に答える