单击DIV中的链接，并在单独的DIV中显示PHP/HTML [英] Click link in DIV and show PHP/HTML in separate DIV

问题描述

我有一个更改的菜单，我想基于与DIV class ="items"中所选项目相关联的链接在DIV id ="main_content"中显示内容

I have a menu that changes and I want to show content in the DIV id="main_content" based on the link associated with the item selected in DIV class="items"

这是我正在使用的jQuery代码(编辑)

Here is the jQuery code I am using (edited)

<script type="text/javascript">
$(document).ready(function(){
    $(".items a").click(function(e){
        e.preventDefault(); 
        $("#main_content").load($(this).attr("href"));
    });
});

</script>

此代码在逻辑上似乎是正确的，在发布到这里之前，我已经进行了广泛的搜索.该问题/帖子是构建代码中最有帮助的问题/帖子之一:

This code seems logically correct and I have searched extensively before posting here. This question/post was one of the most helpful in constructing the code: Clicking a link display it in Different Div on Same Page

单击链接后，它将在新选项卡中打开.所以我的问题是，为什么这不起作用?

When the link is clicked it opens in a new tab. So my question is, why isn't this working?

除jQuery外，我还接受其他建议.任何帮助将不胜感激.

I am open to other suggestions besides jQuery. Any help would be greatly appreciated.

谢谢！

好，所以经过一番尝试和错误后，我发现另一个脚本引起了该问题.我使用下面的脚本来使整个DIV成为可点击的链接.

OK, so after some trial and error I found that another script was causing the problem. I have the script below in use to make the entire DIV a clickable link.

<script type="text/javascript">
 $(document).ready(function(){ 
  $(".items").click(function(){
     window.location=$(this).find("a").attr("href");
     return false;
  })
 });
</script>

反正我可以同时使用两个脚本吗?

Is there anyway I can use both scripts together?

推荐答案

是的，该代码似乎是正确的(无需查看标记).附带说明一下，如果您既想阻止默认操作又要阻止事件传播，则可以只按return false;即可.我建议您只使用e.preventDefault()，除非您确实需要停止该事件的传播.

Yes that code seems right( without looking at the markup). On a side note you could just return false; if you would like to both prevent the default action and stop the event from propagating. I would suggest you only e.preventDefault() unless you need to really also stop the event from propagating.

这篇关于单击DIV中的链接，并在单独的DIV中显示PHP/HTML的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！