1

ページ全体をリロードするか<body>、サイズ変更イベントでのみリロードして、すべてのスクリプトを実行するにはどうすればよいですか。

ボディのみをリロードする場合が望ましいです。ヘッド内にすべての重いプラグインがあり、ボディの最後にボディfunctions.js全体のすべての作業を行う場所があります。

私はもう試した：

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

ただし、スクリプトは新しいDOMでは実行されませんでした。

4

2 に答える 2

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ライブラリを1回だけ開始し、ドキュメントをより詳細に制御します。

于 2013-01-14T14:14:38.457 に答える
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 に答える