web-dev-qa-db-ja.com

jQuery $（document）.ready（）が2回起動します

だから私はここで何が起こっているのかを探ろうとしてウェブをふるいにかけてきたが、具体的な答えを得ることができなかった。

私のサイトには$（document）.readyが1つあり、その中にあるコードに関係なく、複数回実行されるようになっています。

ステートメント内で例外が発生した場合、.readyイベントが2回発生する方法に関するjQueryのバグレポートを参照しました。ただし、次のコードがある場合でも、2回実行されます。

$(document).ready(function() {
    try{    
        console.log('ready');
        }
    catch(e){
        console.log(e);
    }
});

コンソールには、「準備完了」が2回記録されます。例外を含む別の.readyが問題を引き起こす可能性はありますか？私の理解では、すべての.readyタグは互いに独立していましたが、これがどこに作用するのか見つけることができないようです？

サイトのヘッドブロックは次のとおりです。

<head>
<title>${path.title}</title>
<meta name="Description" content="${path.description}" />
<link href="${cssHost}${path.pathCss}" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="media/js/fancybox/jquery.fancybox.pack.js" type="text/javascript" ><!-- --></script>
<script src="/media/es/jobsite/js/landing.js" type="text/javascript" ><!-- --></script>
<script src="/media/es/jobsite/js/functions.js" type="text/javascript"><!-- -->    </script>
<script src="/media/es/jobsite/js/jobParsing.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="/media/es/jobsite/js/queryNormilization.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="${jsHost}/js/jquery/jquery.metadata.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="${jsHost}/js/jquery/jquery.form.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.7/jquery.validate.min.js" type="text/javascript" charset="utf-8"><!----></script>
<script src="${jsHost}/js/jquery.i18n.properties-min.js" type="text/javascript" charset="utf-8"><!----></script>

<script type="text/javascript" charset="utf-8">

function updateBannerLink() {
    var s4 = location.hash.substring(1);
    $("#banner").attr('href','http://INTELATRACKING.ORG/?a=12240&amp;c=29258&amp;s4='+s4+'&amp;s5=^');
}

</script>
</head>

JSP変数には注意を払いませんが、ご覧のとおり、functions.jsファイルを1回だけ呼び出しています（.ready関数が存在する場所です）

javascriptjqueryjavascript-eventsdocument-ready
67
Xenology

Readyイベントは2回起動できません。起こりそうなことは、コードが含まれている要素を移動または操作しているコードがあり、それによりブラウザがスクリプトブロックを再実行することです。

これは、<head>または終了</body>タグの前にスクリプトタグを含め、$('body').wrapInner();を使用してnotを使用することで回避できます。 $('body').html($('body').html().replace(...));を使用しても同じ効果があります。

63
Kevin B

それは私にも起こりましたが、悪いマージのためにスクリプトが2回含まれていたことに気付きました。

37
Charles HETIER

これは、KendoUIを使用しているときに起こりました。ポップアップウィンドウを呼び出すと、document.readyイベントは複数回発生します。簡単な解決策は、グローバルフラグを1回だけ実行するように設定することです。

var pageInitialized = false;
$(function()
{
    if(pageInitialized) return;
    pageInitialized = true;
    // Put your init logic here.
});

それは一種のハックっぽいですが、動作します。

31
qJake

JSファイルを2回含めないようにしてください。それは私の場合でした

12
kakauandme

functions.jsにこれを入れて、2回実行されないようにしてください：

var checkit = window.check_var;
if(checkit === undefined){ //file never entered. the global var was not set.
    window.check_var = 1;
}
else {
    //your functions.js content 
}

ただし、2回目の呼び出し先を確認するために、より詳細に調べることをお勧めします。

2
Mouna Cheikhna

あなたが使用することを検討するかもしれません

window.onload

の代わりに

$(document).ready
2
hvdd

今日も同様の問題がありました。 _<button type="submit">_により、私の場合は$(document).ready(...)イベントが再び発生しました。コードを_<button type="button">_に変更すると、問題が解決しました。

詳細については、stack-overflowの document.ready関数が呼び出しボタンの後に再度呼び出されますか？ を参照してください。

1
lominart

同じコントローラーをhtmlに2回追加すると、この問題が発生する可能性があります。
インスタンスの場合：
[js]

app.controller('AppCtrl', function ($scope) {
 $(document).ready(function () {
        alert("Hello");
        //this will call twice 
    });
});

[html]

//controller mentioned for the first time
<md-content ng-controller="AppCtrl">
    //some thing
</md-content>

//same controller mentioned again 
<md-content ng-controller="AppCtrl">
    //some thing
</md-content>
1
Charitha Goonewardena

パーシャルを更新しようとしたときに、同様の問題が発生しました。 PartialViewResultを返すのではなく、ActionResultを呼び出しました。 ActionResultにより、ready（）が2回実行されました。

1
user3048613

私の場合、$（document）.readyは悪いCSSのために2回起動していました。CSSの一部にbackground-image: url('');があるかどうかを確認してください

0
Posis

Iframeが何も表示せず、他の理由（リロードなしでファイルをアップロードするなど）で使用される場合、次のようなことができます：

<iframe id="upload_target" name="upload_target" style="width:0;height:0;border:0px solid #fff;"></iframe>

Srcが含まれていないことに注意してください。これは、ドキュメントの2番目のon readyトリガーを防ぎます。

0
Alex Sikamiotis

Window.load関数でこの問題が2回実行されました。理由は、メインページと.netユーザーコントロールで同じjavascriptファイルを参照していたためです。メインページで参照を削除したとき、load-functionは一度だけ実行されました。

0
Egil Morten Eriksen