javascript - 为什么 slicknav 不使用由变量设置的 ID 来处理我的 jquery 对象？

Question

我正在尝试在我动态构建的 jquery 对象上激活 slicknav。

这很好用:

(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);

Answer 1

mobileMenuIdentifier 包含 CSS 选择器 #new-menu。如果设置 ID，则不希望 # 成为 ID 值的一部分。只需对代码进行最少的更改，您就可以做到

$('<div>').attr('id',mobileMenuIdentifier.substr(1)); // "new-menu", not "#new-menu"