Почему slicknav не включается в мой объект jquery с идентификатором, установленным переменной?

Я пытаюсь активировать slicknav для объекта jquery, который создаю на лету.

Это работает прекрасно:

(function($){

var mobilemenu={
     slicknavEngage: function(){
         $(mobileMenuIdentifier).slicknav();
     }
}

var rebuildmenu={

    start:function(){
        var $menuParent = //some stuff I need to build menu
            $menuCategories = //more stuff I need for new menu
            $newMenu = $('<div>').attr('id','new-menu'); //my new menu object

            $menuCategories.each(function(i){
                 //build my new menu
            });

        $newMenu.appendTo('body');
        mobilemenu.slicknavEngage();
    }   

}

$(document).ready(rebuildmenu.start);

})(jQuery);

Но я хочу иметь возможность установить идентификатор мобильного меню как переменную конфигурации в верхней части замыкания, как это, к сожалению, это не работает, но я запускал console.log со многих позиций, и всегда отображается правильная переменная, почему так не работает?? Это лишь небольшая часть скрипта, так как нужно установить множество других переменных конфигурации, поэтому я хочу иметь возможность установить и эту. Что может быть не так?

 (function($){

    //global to this closure
    var     mobileMenuIdentifier = '#new-menu';


    var mobilemenu={
         slicknavEngage: function(){
             $(mobileMenuIdentifier).slicknav();
         }
    }

    var rebuildmenu={

        start:function(){
            var $menuParent = //some stuff I need to build menu
                $menuCategories = //more stuff I need for new menu
                $newMenu = $('<div>').attr('id',mobileMenuIdentifier); //my new menu object with the id set by variable - doesn't work!

                $menuCategories.each(function(i){
                     //build my new menu
                });

            $newMenu.appendTo('body');
            mobilemenu.slicknavEngage();
        }   

    }

    $(document).ready(rebuildmenu.start);

    })(jQuery);

1 ответ

Решение

mobileMenuIdentifier содержит селектор CSS #new-menu, Если вы установите идентификатор, вы не хотите # быть частью значения идентификатора. С минимальными изменениями сделайте ваш код, вы можете сделать

$('<div>').attr('id',mobileMenuIdentifier.substr(1)); // "new-menu", not "#new-menu"
Другие вопросы по тегам