Question

点击一些初始网站链接后，我想用ajax 刷新整页。

示例：

我们已经开通网站www.love.com，它有一个链接到www.love.com/somepage.html

点击此链接后，必须使用ajax刷新整页（somepage.html替换活动页面）

当页面被替换时，必须有一些淡入/淡出效果。

如何？

也许某个插件可以做到这一点，任何链接？

Answer 1

整页请求与AJAX的目的相矛盾，

但如果你坚持:) 你可以使用一个巨大的div作为你的页面的占位符，并使用jQuery Load / Ajax

div看起来像这样

<div id="yourhugediv"></div>

以及您可以使用的功能

function changeUrl(href)
{
   $('#yourhugediv').load(href);
   href = (href == "") ? "/" : href;
   uri = window.location.href.split("#/");
   window.location.href = uri[0] + "#/" + href;
}

手动将功能添加到链接

<a href="#" onclick="changeUrl('http://love.com/somepage.html')">to load</>

或使用jQuery选择器迭代每个锚

$('a').click(function()
{
    changeUrl(a.attr('href'));
});
$('a').attr('href','#');

Answer 2

听起来你正在尝试使用jQuery，因为有人告诉你应该使用jQuery - 链接标签本身完成这项工作而不需要任何脚本

好的 - 我们必须做我们的女朋友告诉我们做的事情......

我想你可以这样做：

$("body").load("next_page.html");

或

$("html").load("next_page.html");（这甚至会起作用吗？）

Answer 3

使用FAJAX（假AJAX）。它将为您提供您所寻找的“酷”。在页面中使用这些元标记将使用淡入和淡出效果进行整页刷新。

<META http-equiv="Page-Enter" content="blendTrans(Duration=0.2)">
<META http-equiv="Page-Exit" content="blendTrans(Duration=0.2)">

元标记仅适用于IE，但有一些方法可以在其他使用JavaScript的浏览器中获得类似的结果。

<html>
<head>
    <title>Page Title</title>
    <META http-equiv="Page-Enter" content="blendTrans(Duration=0.2)">
    <META http-equiv="Page-Exit" content="blendTrans(Duration=0.2)">
    <script type="text/javascript">
        function fadeInit() {
            document.body.style.opacity=0.2; // initialise
        }

        function fadeIn() {
            var bodyStyle=document.body.style;
            if ( bodyStyle.opacity < 1) {
                bodyStyle.opacity=((bodyStyle.opacity*10)+1)/10; //Add 0.1
                setTimeout('fadeIn();',100)
            }
        }
    </script>
</head>
<body onload="fadeInit();fadeIn();">

</body>
</html>

Answer 4

只需建立指向那里的链接：

<a href="http://www.love.com/somepage.html">link text</a>

ps：我有点困惑但是......你已经有一个指向该页面的链接导致一个新请求（整页刷新），为什么需要AJAX我不知道......

Answer 5

由于另一个页面位于同一个域中，您可以抓取另一个页面来检索您感兴趣的数据。您甚至可以用另一个页面中的body标签内容替换当前页面的整个body标签。页。

该过程将类似于：用户在当前页面上执行一些操作以触发所需的操作，JavaScript使AJAX请求获取somepage.html并将结果存储在字符串中，JavaScript相当于innerHTML（或jQuery.html（））用somepage.html中检索到的内容替换当前页面（或div或其他）的内容并添加特殊效果。

理论上，这将允许您使用somepage.html中的任何内容完全替换当前页面的内容。

Answer 6

我知道这是一个老帖子，但我认为你正在寻找的是通过使用BBQ jQuery插件解决的：http://benalman.com/projects/jquery-bbq-plugin/

如何使用jQuery Ajax刷新页面？

6 个答案: