防止加载后起泡？

发布于 2024-09-18 12:19:22 字数 804 浏览 4 评论 0原文

我有一个大问题。

我有一个名为“#box”的 div，它在单击其中的链接后加载外部内容：

$("#box a").click(

 function(e)
 { 
 e.preventDefault(); 
 var hash = this.parentNode.hash;
    $("#boxLoaded").load('boxFiles/'+ hash.substring(1) +'.html');
    $("#box").fadeOut(100);  
    $("#boxLoaded").fadeIn(200);     
 });

到目前为止很简单:)

当有人单击“#boxLoaded”中的任意位置时，它会消失并再次加载框，所以它看起来像一开始：

$("#boxLoaded").click(
    function()
    {  
        $("#boxLoaded").fadeOut(200);
        $("#box").show(); 
 });

问题是我在加载的文件（#boxLoaded 内部）中有一个名为“box-menu”的菜单，当有人单击它们时 - 上面的代码正在执行（淡出#BoxLoaded 并显示#Box）。

我想阻止这种情况发生，但是：

$("#box-menu").click(
    function(e)
    {  
        e.preventDefault() 
 });

该怎么办？当我不加载（）这些文件时，它工作正常......

原文

I've a huge problem.

I'm having a div named "#box" that loads external content after clicking links in it:

$("#box a").click(

 function(e)
 { 
 e.preventDefault(); 
 var hash = this.parentNode.hash;
    $("#boxLoaded").load('boxFiles/'+ hash.substring(1) +'.html');
    $("#box").fadeOut(100);  
    $("#boxLoaded").fadeIn(200);     
 });

Easy so far :)

When somebody clicks anywhere in "#boxLoaded" it disappears and loads box again, so it looks like in the beginning:

$("#boxLoaded").click(
    function()
    {  
        $("#boxLoaded").fadeOut(200);
        $("#box").show(); 
 });

The problem is I have a menu named "box-menu" in loaded files (inside of #boxLoaded) and when somebody clicks them - the code above is being executed (fading out #BoxLoaded and showing #Box).

I want to prevent it from happening, but:

$("#box-menu").click(
    function(e)
    {  
        e.preventDefault() 
 });

What to do? It works fine, when I'm not loading() these files...

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

你没皮卡萌 2024-09-25 12:19:22

您只需切换到 .live() 并停止冒泡通过 event.stopPropagation() 此处：

$("#box-menu").live("click", function(e) {
  e.stopPropagation();
});

或者，您可以重新绑定然后加载，更改为

$("#boxLoaded").load('boxFiles/'+ hash.substring(1) +'.html');

：

$("#boxLoaded").load('boxFiles/'+ hash.substring(1) +'.html', function() {
  $("#box-menu").click(function(e) { e.stopPropagation(); });
});

You just need to switch to .live() and stop the bubbling via event.stopPropagation() here:

$("#box-menu").live("click", function(e) {
  e.stopPropagation();
});

Alternatively, you can re-bind then loading, changing this:

$("#boxLoaded").load('boxFiles/'+ hash.substring(1) +'.html');

To this:

$("#boxLoaded").load('boxFiles/'+ hash.substring(1) +'.html', function() {
  $("#box-menu").click(function(e) { e.stopPropagation(); });
});

回复收藏 0 原文

初与友歌 2024-09-25 12:19:22

通过调用e.preventDefault()，您只是阻止链接恢复其默认事件。单击包含的 div #boxLoaded 中的链接后，仍然具有其 onclick() 命令。不要使用e.preventDefault()，而是尝试return false。我认为在这种情况下应该与 preventDefault() 执行相同的操作，并且还中止后面的命令。

-- 我还不能评论人们的帖子，但回复 Nick，“太酷了，没有意识到有一个 e.stopPropagation() 函数”