0

我正在尝试使用 jQuery 将外部页面加载到当前页面中，而用户不会看到页面加载。

当我调用页面“info.php”时，它被加载到#contentdiv 中。这就是脚本应该做的事情。问题是在包含脚本和 div 的主页中#content，我已经有一些代码，我希望它在有人访问该页面时执行，而不是从任何外部页面调用。这是可行的，但是当我单击菜单中的一个链接时，我无法返回到初始内容。

这是我的代码的一个例外：

<script>
$(function() {
   $('#nav a').click(function() {
    var page = $(this).attr('href');
    $('#content').load(page + '.php');
    return false;
    });
});
</script>

<ul id="nav">
<li><a href="#">Page1</a></li>
<li><a href="about">About</a></li>
<li><a href="contact">Contact</a></li>
<li><a href="info">Info</a></li>
</ul>

<div id="content">
Here I have some code that I wanted to be attributed to the "Page1"
</div>
4

2 回答 2

0

我对 load() 不是很熟悉，但在这种情况下，我认为您应该使用 ajax 来加载页面而不刷新。

var page = $(this).attr('href');
$.ajax({
  url: page + '.php',
  success: function(data)
  {
     $('#content').html(data);
  }
})

编辑：你说“当我点击菜单中的一个链接时，我无法返回到初始内容”，你的意思是你在 div #content 中有一些代码并且 onclick 你已经覆盖了它的内容?

于 2012-09-21T07:22:48.740 回答
0

这是示例：

$(function()
{
   var content = $('#content');

   $('#nav a').click(function(e) {
       e.preventDefault();
       var page = $(this).attr('href');

       content.children().hide();
       var pageContent = content.find("#" + page);
       if(pageContent.length > 0)
       {
           pageContent.show();
       }
       else // put ajax here
       {
           content.append($('<div>').attr('id', page).text('New page ' + page));
       }
   });
});

演示：jsfiddle.net/3jLjw/

于 2012-09-21T09:36:09.783 回答