参考

Question

我在网站的标题上放了一个菜单。其中一个菜单链接如下：

<a href="#" class="controlpanel-link">&nbsp;Control Panel</a>

我有一个jQuery函数应该可以看到一个弹出窗口：

$(document).ready(function(){
    jQuery(".controlpanel-link").click(function() {
        $("#controlpanel").show();
    });
    jQuery("#close-cp").click(function() {
        $("#controlpanel").hide();
    });
});

正如标题中所示，它出现在所有页面上。在索引页面上执行jQuery，在其他页面上没有发生任何事情，并且控制台没有显示任何错误。在这种情况下我该怎么办？提前谢谢！

Answer 1

在开始之前，我会稍微清理一下这段代码。这样可以确保您在代码中与之交互的jQuery对象不会影响其他javascript，反之亦然。它也是jQuery $(document).ready中的简写。有关更多信息，请参阅下面关于闭包的参考。

(function($){
  $(".controlpanel-link").click(function() {
    $("#controlpanel").show();
  });
  $("#close-cp").click(function() {
    $("#controlpanel").hide();
  });
})(jQuery);

有一些可能导致这种行为的事情：

如果这是一个单页Web应用程序，则在呈现新视图时，您绑定的元素可能不会被绑定。
根据您可能拥有的其他javascript，页面上可能不存在这些元素。

调试

如果您还没有，我建议至少使用您的javascript控制台和console.log语句来查看您的点击事件是否实际被触发。控制台还会通知您代码可能产生的任何javascript错误。如果您对此有所了解，我建议您使用断点进行更高级的调试。

参考

Javascript闭包：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Closures

jQuery $(document).ready：https://learn.jquery.com/using-jquery-core/document-ready/

console.log：https://developer.mozilla.org/en-US/docs/Web/API/Console/log

＆＃34;在代码中设置javascript断点 - 在chrome＆＃34;：Set a javascript breakpoint in code - in chrome?

jquery没有在其他页面上工作

1 个答案:

调试

参考