0

我正在将项目中的代码上传到 Plunker。你可以在这里看到它。当我通过本地服务器运行代码并在 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 中工作？是否有更通用的代码可以使用，或者我只是做错了什么？

干杯

4

1 回答 1

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).

于 2014-10-24T15:50:16.127 回答