ページでイベントを機能させる場合は、$(document).ready()関数内でイベントを呼び出す必要があります。DOMが読み込まれるとすぐに 、ページのコンテンツが読み込まれる前に、その中のすべてが読み込まれます。
ページのコンテンツが読み込まれた後にのみJavaScriptコードを実行したいのですが、どうすればよいですか?
回答:
のload
代わりに使用ready
:
$(document).load(function () {
// code here
});
更新.on()
jQuery1.8以降
を使用する必要があります。(http://api.jquery.com/on/)
$(window).on('load', function() {
// code here
});
この答えから:
http://blog.jquery.com/2016/06/09/jquery-3-0-final-released/によると:
非推奨のイベントエイリアスを削除しました
.load
、.unload
、および.error
、jQueryの1.8から非推奨、それ以上ではありません。.on()
リスナーを登録するために使用します。
$(document).on('load', ...
てみる間違いに気をつけてください$(window).on('load',...
以下
$(document).ready(function() {
});
交換可能
$(window).bind("load", function() {
// insert your code here
});
ページの読み込み時間を増やすために使用している方法がもう一度あります。
$(document).ready(function() {
$(window).load(function() {
//insert all your ajax callback code here.
//Which will run only after page is fully loaded in background.
});
});
誰もこれに言及しなかった
$(function() {
// place your code
});
これはの省略関数です
$(document).ready(function() { .. });
編集:このコードは、すべてのコンテンツ(画像とスクリプト)が完全に読み込まれ、ブラウザーにレンダリングされるまで待機します。
私が使用し$(window).on('load',function(){ ... })
たJavascriptはフォーマットと要素の非表示を目的としていたため、コードの起動が速すぎるというこの問題が発生しました。非表示が早すぎて、高さが0のままになっている要素。
私は今使っ$(window).on('pageshow',function(){ //code here });
ています、そしてそれは私が必要な時に発火します。
私は同じ問題を探しています、そしてここに私を助けるものがあります。これがjQueryバージョン3.1.0であり、loadイベントはjQueryバージョン1.8以降の使用が非推奨になっています。loadイベントはjQuery3.0から削除されます。代わりに、onメソッドを使用して、JavaScriptロードイベントをバインドできます。
$(window).on('load', function () {
alert("Window Loaded");
});
また、最初の関数が終了した後に2番目の関数を実行する場合は、このstackoverflowの回答を参照してください。
この中に実行したいコードを書いてください。ドキュメントの準備ができたら、これが実行されます。
$(document).ready(function() {
});