1

既存の UL に基づいて、モバイル デバイス用の選択ドロップダウン メニューを構築しています。これは、古いバージョンの jQuery (1.4.1) で正常に機能していました。ただし、jQuery をバージョン 1.9.1 に更新したところ、コードがメニューを壊してしまいました。壊れているセクションは、実際には現在表示しているセクションの子メニューです。

var mobileMenu = function (menuParent, prevSibling) {

    var $select = $('<select>', {
        class: 'mobileMenu'
    }).insertAfter(prevSibling);

    $(menuParent).each(function () {
        var $li = $(this),
            $a = $li.find('> a'),
            $p = $li.parents('li'),
            prefix = new Array($p.length + 1).join('-');

        var $option = $('<option>')
            .text(prefix + ' ' + $a.text())
            .val($a.attr('href'))

        if ($(this).hasClass("selected")) {
            $option.attr('selected', true);
        }

        $option.appendTo($select);

        if ($(this).hasClass("selected")) {
            mobileSubNav($select);
        }

    });

    $(".mobileMenu").change(function () {
        window.location = $(this).find("option:selected").val();
    });
};

var mobileSubNav = function (navContainerName) {
    $('.main_nav_sub li').each(function () {
        var $li = $(this),
        $a = $li.find('> a'),
        $p = $li.parents('li'),
        prefix = new Array($p.length + 1).join('-');

        var $option = $('<option>')
        .text(prefix + '--' + $a.text())
        .val($a.attr('href'));
        $option.before(navContainerName);
    });
}

最後から 3 行目の before() メソッドのようです。jQuery バージョン 1.9 のアップグレード ガイドには、「親のないノードで .after()、.before()、または .replaceWith() を使用しようとしても効果がない」と記載されています。これは、親要素がまだ dom に追加されていないため、スクリプトが壊れているということですか? 誰かが何が起こっているのかを明らかにし、それを修正するために私を指摘できますか?

ありがとう

4

1 に答える 1

0

1.4.1 と比べて、ここでは多くのことを変更する必要があります。必ず jQuery Migrate を使用してください。それらの多くを見つけるのに役立ちます。

class: 'mobileMenu'

これは、jQuery に関係なく、一部のブラウザーでは常にエラーでしclassた。これはキーワードであるため、単語を引用する必要があります。

'class': 'mobileMenu'

プロパティを設定するための の使用は.attr()1.6 以降非推奨になっているため、.prop()代わりに次のようにする必要があります。

$option.attr('selected', true);

あなたの質問について.before()は、そもそもなぜそれが機能したのかわかりません。select 要素のようnavContainerNameです。そうであれば、オプションを使用する.appendTo()か.prependTo()、オプションを追加する必要があります。

于 2013-04-05T12:11:40.943 に答える