web-dev-qa-db-ja.com

jQuery UIダイアログ-*ダイアログが関数ではありません*エラー

Pinaxを使用してサイトを開発しています。テンプレートの1つで、単純なjqueryダイアログボックスを開こうとしています。しかし、「Dialog not a function」というJavaScriptエラーが発生し続けます。私はjquery 1.2.6とjquery-ui 1.6を使用しています。私のJavaScriptとHTMLは次のとおりです。

<html>
<head>
<link type="text/css" href="/site_media/smoothness/ui.all.css" rel="stylesheet" />
<script src="/site_media/jquery.js" type="text/javascript"></script>
<script src="/site_media/ui/ui.core.js" type="text/javascript"></script>
<script src="/site_media/ui/ui.draggable.js" type="text/javascript"></script>
<script src="/site_media/ui/ui.resizeable.js" type="text/javascript"></script>
<script src="/site_media/ui/ui.dialog.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
                    $('#dialogbox').dialog();
            });
 </script>
 </head>
 <body>
   <div id="dialogbox" title="dialog title">
     <p>Test dialog</p>
   </div>
 </body>
 </html>

なぜこれが起こっているのか誰かが説明できますか？

jqueryjquery-uijquery-ui-dialog
17
kartikq

Googleの公開バージョンを使用するか、jQuery UIサイトからレガシー（1.6）バージョンをダウンロードし、手動でファイルを含めて、エラーを再現しようとしました。どちらも問題の原因にはなりませんでした（ http://jsbin.com/uloqi 動作確認）。

つまり、次のいずれかで問題が解決する可能性があります。

  1. Firebug for Firefoxなどのツールを使用して、各JSファイルが含まれていることを確認します。
  2. エラーを引き起こす可能性のあるページに他のJSがないことを確認してください。
  3. ダウンロードしたファイルの正しいバージョンがあることを確認します。

貼り付けたコードを適切なファイルと組み合わせると完全に機能するため、他に何を伝えればよいかわかりません。

36
Doug Neiner

上記の問題とまったく同じ問題が発生しました（メッセージボックスが開くのは1回だけです）。私が抱えていた問題は、メッセージボックスのhtmlもjqueryをロードすることでした。必要ないので問題なく外せました。そうでない場合は、問題をもう少し突き止める必要があるかもしれません。

4
Sander

特定の状況下では、複数の異なるJQueryバージョンが同時にロードされると、このエラーが発生する可能性があります。

私の場合、ASPマスターを使用したページがあります。私のマスターはJQuery 1.4.2.minを含んでいました私のaspxページはJQuery 1.7.2.minを含んでいました

コントロールからJQuery関数が呼び出されたときに、どのJQueryを使用するかについて混乱しました。そのため、そのスクリプトはJQueryがロードされている（JQueryバージョンを表示できる）と述べても、JQuery関数を見つけることができませんでした。

AspxファイルからローカルのJQuery 1.7.2.minのインクルードを削除し、メーターを1.4.2.minから1.7.2.minに更新すると、問題は解消しました。

2
Paul Gorbas

ダグ・ネイナーの答えは本当に役に立ちました。私の場合は少し複雑でしたが、それでも同じことが言えます。

次のようにページBをロードするページAからダイアログを開きました。

$('#MyDiv').dialog({
    autoOpen: false
})
$("#MyDiv").load("PageB.aspx", function () {
    $("#MyDiv").dialog("open");
});

問題は、ページAとページBの両方にjQueryが含まれていたことです。注意：別のページをダイアログにロードする場合、同じjsを含める必要はありません。

2
user1575422

私にもこの問題があり、私のために機能する唯一の解決策は、次のようなダイアログ参照を保存することでした：

var confirmDialog = $( "#dialog-confirm" ).dialog({
    autoOpen: false
});
$("#test").click(function () {
    confirmDialog.dialog('open');
});

そうでなければ、私が試したすべてが失敗しました

.dialog（）は関数エラーではありません
0
Striped

すでに説明したように、おそらく既存のライブラリをオーバーライドします。

これに対処する1つの方法は、正しいファイルがロードされるようにすることです。

別の方法は、ダイアログとダイアログのコンテンツの間にiframeを挿入することです。 iframeは、ブラウザによって、独自のスクリプトを含む個別のページとして扱われます。したがって、iframeの「上」にあるコンテンツのスクリプトは、iframeの「下」にあるダイアログのスクリプトとは別になります。

0
Gerhard Liebenberg

私も同じ問題を抱えていました。 Mineは、1.11.4から1.12.1へのjQuery UIの更新により自己負担しました。 NuGetを使用してアップグレードをインストールし、NuGetはプロジェクトから古い1.11.4参照を削除しましたが、新しいプロジェクト参照を追加していません。

ローカルで実行するとアプリケーションはうまく機能しましたが、デプロイしたときに、新しい1.12.1ファイルでパブリッシュできませんでした。これが他の誰かの役に立つことを願っています。

0
Rafiki