0

こんにちはみんな私はこのように見える1ページにいくつかのナビゲーションがあります：

<div class="menu">
 <ul>
  <li>link here</li>
 <li>Link Here</li>
</div>

1ページに2つか3つあります。

それらをjqueryの選択ボックスとオプションボックスに入れるのに問題があります。

1ページに1つしかない場合は、100％動作しますが、1ページに2つまたは3つあるため、すべてのドロップダウン選択ボックスに最初のメニューしか入力されない場合があります。

jqueryは次のとおりです。

jQuery("<select />").appendTo(".menu");
    jQuery("<option />", {"selected": "selected","value"   : "","text" : "Navigation Menu"}).appendTo(".menu select");
    jQuery(".menu ul li a").each(function() {

        var el = jQuery(this);
        jQuery("<option />", {"value"   : el.attr("href"),"text"    : el.text()}).appendTo(".menu select");
    });

    jQuery(".menu select").change(function() {

        window.location = jQuery(this).find("option:selected").val();
    });

私はそれがこのように見えることを意図していることを知っていますが、それはただエラーを投げるだけです。

jQuery("<select />").appendTo(".menu");
    jQuery("<option />", {"selected": "selected","value"   : "","text" : "Navigation Menu"}).appendTo(".menu select");

    var showlis = 'ul li a';
    jQuery(this + showlis).each(function() {

        var el = jQuery(this);
        jQuery("<option />", {"value"   : el.attr("href"),"text"    : el.text()}).appendTo(".menu select");
    });

    jQuery(".menu select").change(function() {

        window.location = jQuery(this).find("option:selected").val();
    });
4

3 に答える 3

3

.menuクラスだけで参照するのではなく、各項目を個別に参照する必要があります。

以下のコードは次のとおりです。

.menuDOM内のそれぞれについて（ページ）

  1. を作成して追加し<select>ます
  2. <option>デフォルトの要素を追加します
  3. <li>と対応する<option>内部をループします<select>

デモ： http： //jsfiddle.net/5dm37/

コード：

$('.menu').each(function() {
    var menu = $(this);
    var sel = $("<select />").appendTo(menu);
    $("<option />", {
        "selected": "selected",
        "value": "",
        "text": "Navigation Menu"
    }).appendTo(sel);
    menu.find('li').each(function() {
        $("<option />", {
            "value": $(this).attr("href"),
            "text": $(this).text()
        }).appendTo(sel);
    });
    sel.change(function() {
        alert($(this).val());    
    });
});
于 2012-10-01T15:35:34.383 に答える
0

クローン移動要素の外部にあるすべてのjQuery操作関数。

http://api.jquery.com/category/Manipulation/?rdfrom=http%3A%2F%2Fdocs.jquery.com%2Fmw%2Findex.php%3Ftitle%3DManipulation%26redirect%3Dno

これは、メニュークラスdivごとに、新しい要素を作成する必要があることを意味します。1つの要素を作成すると、それが最初のメニュークラスdivに追加されます。

元：

$(".menu").each( function(index, element) {
    //Create select and options here
    $(element).append(SELECT);
});
于 2012-10-01T15:31:28.807 に答える
0

私が気づくいくつかのこと：

  1. 単なるコピーアンドペーストエラーかどうかはわかりませんが、ナビゲーションメニューに終了<ul>タグがありません。これは無効なHTMLです。
  2. これはおそらくあなたの問題です。<select />jQueryセレクターで見つかった要素に新しいタグを追加しています.menu。そのセレクターは、すべての要素をmenuクラスと照合します。メニュークラスのどの要素に追加しようとしているのかわからないため、おそらく毎回最初の要素に追加するだけです。セレクターを絞り込む必要があります。これを行う最良の方法は、おそらく各ナビゲーション<div>にid属性を与え、それをセレクターとして使用することです。
  3. なぜあなたがこれをしたいと思うのか、私は非常に混乱しています。あなたはすでにあなたのナビゲーションのためのリストを持っています、なぜあなたはそこにもドロップダウンを入れようとしているのですか？
于 2012-10-01T15:36:58.767 に答える