简体   繁体   English

enquire.js javascript无法执行(enquire.js,Modernizr,jQuery)

[英]enquire.js javascript doesn't execute (enquire.js, Modernizr, jQuery)

I'm trying to add Modernizr and enquire.js to my website for a cleaner mobile implementation that only loads desktop content when the desktop media query actually applies, rather than just hiding it. 我正在尝试将Modernizr和enquire.js添加到我的网站,以实现更清洁的移动实现,该实现仅在实际应用桌面媒体查询时才加载桌面内容,而不仅仅是将其隐藏。 However, my attempt is already blocked by the fact that enquire.js doesn't seem to work at all. 但是,我的尝试已经被enquire.js似乎根本不起作用的事实所阻止。

It seems I have managed to get Modernizr to run properly, since my unrealsp.js is loaded (the dropdown menu-related part of the code works fine), but the code in the enquire.js part is never executed no matter what I do. 看来我已经设法使Modernizr正常运行,因为我的unrealsp.js已加载(代码的与下拉菜单相关的部分工作正常),但是无论如何我都不会执行enquire.js部分中的代码。 Any help would be quite appreciated. 任何帮助将不胜感激。

My HTML code: 我的HTML代码:

<head>
    <!-- [...] -->
    <!--[if lt IE 9]>
    <script src="includes/html5shiv.js"></script>
    <![endif]-->
    <script src="includes/js/modernizr.min.js"></script>
</head>

<!-- [...] -->

<script type="text/javascript">
Modernizr.load([
    {
        test: window.matchMedia,
        nope: "includes/js/media.match.min.js"
    },

    "//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js",
    "includes/js/enquire.min.js",
    "includes/js/unrealsp.js"
]);

My "unrealsp.js" code: 我的“ unrealsp.js”代码:

$(document).ready(function(){
    $("ul.topmenu li a").click(function(event) {
        var element = $(this).parent().find("ul.submenu");
        //Following events are applied to the submenu itself (moving submenu up and down)
            $(this).parent().parent().find("ul.submenu").not(element).slideUp();
            element.slideToggle(); //Drop down the submenu on click }
    });

    enquire.register("screen and (min-width:62em)"), {
    match : function() {
        alert("Matched!");
    },
    unmatch : function() {
        alert("Unmatched!");
    } 
}
});

Console output of an error in enquire.min.js (I'm using the newest one): 控制台输出enquire.min.js中的错误(我正在使用最新的错误):

Uncaught TypeError: Cannot read property 'deferSetup' of undefined enquire.min.js:7
s enquire.min.js:7
o.addHandler enquire.min.js:7
(anonymous function) enquire.min.js:7
i enquire.min.js:7
r.register enquire.min.js:7
(anonymous function) unrealsp.js:9
c jquery.js:7341
p.fireWith jquery.js:7403
b.extend.ready jquery.js:6875
H jquery.js:6601

You've closed the enquire.register() method too quickly. 您太快关闭了enquire.register()方法。

Here's the working code: 这是工作代码:

enquire.register("screen and (min-width:62em)", { // <-- the bracket was here
  match : function() {
    alert("Matched!");
  },
  unmatch : function() {
    alert("Unmatched!");
  } 
}); // Note the closing round bracket here

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM