如何在用户点击链接时将网页加载到div中？

Question

我正在使用jquery，我正在寻找一个用户点击一个链接，并加载服务器响应（在这种情况下，一个线路确认）在同一个div链接。我走了一圈又一圈在这一点上，似乎无法做到正确。下面是我从本网站这是类似的另一篇文章有​​，但不是代码关闭足以让我神交...

<a href="http://10.0.1.2:8888/?ACT=24&tag_id=8" class="load_link">Add to Watchlist*</a> 

<script type="text/javascript"> 
(function($) { 
    $(function() { 
    $('.load_link').click(function() { 
     $(this).next('div').load(this.href); 
     return false; 
    }); 
    }); 
})(jQuery); 
</script> 

任何想法我做错了吗？

感谢

Answer 1

如果锚被包裹一个div里面，你想在这个div你可以使用.closest()方法加载响应：

<div> 
    <a href="http://10.0.1.2:8888/?ACT=24&tag_id=8" class="load_link">Add to Watchlist*</a> 
</div> 

然后：

$(this).closest('div').load(this.href); 

如果存在与锚相邻的div：

<a href="http://10.0.1.2:8888/?ACT=24&tag_id=8" class="load_link">Add to Watchlist* 
<div></div> 

然后.next()方法应该工作。

Answer 2

如果您将内容加载到包含div中，则链接将被替换。
因此，在具有链接的主div中添加一个span/div，并使用此子span/div加载内容。

e.g：

<div> 
    <span class="content"></span> 
    <a href="http://10.0.1.2:8888/?ACT=24&tag_id=8" class="load_link">Add to Watchlist*</a> 
</div> 

<script type="text/javascript"> 
(function($) { 
    $(function() { 
     $('.load_link').click(function() { 
       $(this).siblings(".content").load(this.href); 
       return false; 
     }); 
    }); 
})(jQuery); 
</script> 

Answer 3

出发点是安装萤火虫并进入调试会话，这样就可以逐步执行代码。你也想在document.ready（）上做绑定，以确保在DOM准备好后绑定。