Question

我将代码从我的项目上传到Plunker。你可以看到它here。当我通过本地服务器运行代码并在Chrome中呈现代码时，功能正常。当我尝试通过Plunker运行它时代码失败。

此代码段位于script.js：

内

$('.navbar-toggle').click(function(){

  alert('test1');

    if ($(this).hasClass('login')) {
        $('.navmenu-style1').css("z-index","1");
        $('.navmenu-style').css("z-index","0"); 
    }
    else {
        $('.navmenu-style1').css("z-index","0");
        $('.navmenu-style').css("z-index","1");
    }
});

我怎样才能让它在Plunker中运作？是否有一些我可以使用的更通用的代码，或者我只是做错了什么？

干杯

Answer 1

你在使用JQuery时犯了一个最常见的错误。您尝试在加载DOM之前将单击处理程序附加到DOM对象：

<html>
<head>
...
<script src="script.js"></script>

script.js的内容：

$('.navbar-toggle').click(function(){ ... });

在运行该代码之前，必须等待DOM加载。像这样：

$(function () {
    $('.navbar-toggle').click(function(){ ... });
});

注意：$(function)只是$(document).ready(function)的快捷方式。

$（。'class-name'）。click（function（）{...}）停止跨浏览器功能？

1 个答案: