javascript - pjax; 挿入されたコンテンツの一部のスクリプトがページの更新時に機能しない

Question

この投稿に基づいて、NancyFx と pjax を使用してアプリを作成しました。

私は基本がうまく機能しています。リンクをクリックすると、コンテンツが読み込まれ、そのコンテンツの ajax フォームが正常に機能します。

ただし、F5 キーを押してページを更新すると、JavaScript の一部が実行されません。

たとえば、フォームには、フォームが送信された後に表示される div が含まれており、成功/エラーメッセージが表示されます。このパネルは、フォームが次のコードで読み込まれると非表示になります。

$('#successPanel').hide();

リンクをクリックして pjax がコンテンツをロードすると、成功パネルが非表示になります。問題は、F5 キーを押してページを強制的に更新すると、このコードが機能しないことです。js は、次のように pjax によって挿入されたコンテンツに含まれるファイルにあります。

<script type="text/javascript" src="/Content/js/formIncomeExpenses.js"></script>

そのファイルに console.log があり、ページが更新されると呼び出されます。ただし、successPanel は表示されたままです。

私のレイアウトには、jquery および pjax スクリプトと、ここから使用しているフォームプラグインが含まれています。

Bootstrap と Datatables.net も使用しています。これらはすべて一緒に問題なく動作し、非 pjax バージョンのアプリも問題なく動作します。

私が間違っていることはありますか？

score 0 · Accepted Answer

ありがたいことに、これは DOM の準備ができていない場合であることが判明し、これを使用すると問題が修正されました。

$(document).ready(function() { // hide the success panel $('#successPanel').hide(); });

1 に答える 1