1

如何重新加载整个页面或<body>仅在调整大小事件并执行所有脚本。

我更喜欢仅重新加载 body 的 case，我在 head 内安装了所有重型插件，在 body 的末端，我可以在 bodyfunctions.js上完成所有工作。

我试过了：

var url = document.URL;
$('html').load(url);

但是脚本没有在新的 DOM 上执行。

4

2 回答 2

0

要在窗口调整大小时重新加载页面，您可以执行以下操作：

window.onresize = function(event) {
  window.location.reload();
};

但我认为你真正需要的是创建一个响应式页面。响应式页面会根据窗口大小自行调整，如果您调整窗口大小，它将自动调整元素而无需重新加载页面。

CSS 示例：

/* Example for Smartphones */
@media only screen 
and (min-device-width : 320px) 
and (max-device-width : 480px) {
/* Your Styles */
}

/* Example for  Desktops and laptops */
@media only screen 
and (min-width : 1224px) {
/* Your Styles */
}

完整的例子在这里

我建议你搜索媒体查询和响应式设计，你会发现很多例子。

于 2013-01-14T15:09:15.157 回答
0

老实说，在不丢失范围的情况下，您可以更好地创建持有者。否则你的 ajax 调用不会很有用。像下面这样

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Ajax preview</title>
</head>

<body>
    <div id="siteHolder"></div>
</body>
</html>

而不是使用您正在使用的 jQuery 插件将新页面插入到带有 id 的 div 中，#siteHolder所以看起来像：

var request = $.ajax({
  url: "example.html",
  dataType: "html"
});

request.done(function(data) {
  $("#siteHolder").html( data );
});

request.fail(function(jqXHR, textStatus) {
  alert( "Request failed: " + textStatus );
});

这样，您将只启动一次您的 css 和 js 库，并更好地控制您的文档。

于 2013-01-14T14:14:38.457 回答