2

我在页面上有一个隐藏的 div，需要在点击功能上打开。

可点击链接位于引导弹出框内，因此如何通过单击弹出框内容链接打开页面 div。

这是小提琴

$( "#open" ).click(function() {
      $('.open-this').slideToggle("slow");
    });
4

2 回答 2

2

而不是这段代码：

$( "#open" ).click(function() {
      $('.open-this').slideToggle("slow");
    });

试试这个

$("body").on("click","#open",function(e) {
    e.preventDefault();
      $('.open-this').slideToggle("slow");
    });

查看更新的小提琴http://jsfiddle.net/bfkLM/15/

您的代码的问题是链接是从您的代码生成的，而不是当您的事件处理程序试图让它将click事件附加到它时出现在 dom 中。

所以解决方案是使用委托事件：来自官方；jQuery网站

委托事件的优点是它们可以处理来自以后添加到文档的后代元素的事件。通过选择在附加委托事件处理程序时保证存在的元素，您可以使用委托事件来避免频繁附加和删除事件处理程序的需要。例如，该元素可以是模型-视图-控制器设计中视图的容器元素，或者如果事件处理程序想要监视文档中的所有冒泡事件，则可以是文档。在加载任何其他 HTML 之前，文档元素在文档的头部是可用的，因此在此处附加事件是安全的，而无需等待文档准备好。

这就是为什么我的新代码可以工作的原因，因为它将事件处理程序附加到body标签并检查点击事件是否来自我的目标元素（open），当这种情况发生时，它将启动我的代码并显示弹出窗口

还有一件事，它的用途e.preventDefault();是防止页面导航到href锚点的属性。

于 2013-10-03T12:10:36.910 回答
0

该事件未附加到链接，因为我猜您在文档准备好后没有这样做。

出于测试目的，我在链接中添加了 onclick 功能

onclick="$(\'.open-this\').slideToggle("slow");return false;"

它奏效了。

小提琴


解决方案： 

$(function(){
   $( "#open" ).click(function() {
      $('.open-this').slideToggle("slow");
      return false;
   });
});
于 2013-10-03T12:08:42.177 回答