jQuery UI“ $（”＃datepicker“）。datepickerは関数ではありません”

既存の.aspxページでjQueryのUIプラグインであるDatePickerを使用すると、次のエラーが発生します。

$("#datepicker").datepicker is not a function

ただし、datePickerを作成して使用する同じコードをコピーして、aspxページと同じディレクトリにあるHTMLファイルに貼り付けると、問題なく動作します。これにより、aspxページにJSファイルがあり、datePickerまたはjQueryのUI JSファイルが適切に読み込まれない原因となっていると想定します。

誰かが私の信念を確認したり、jQueryのUIプラグインを妨害している犯人を見つけるためのヒントを提供したりできますか？

同様の問題に何時間も苦労しました。その後、jQueryが2回含まれていることがわかりました。1つはjQuery関数を追加するプログラムによるもので、もう1つは社内デバッガーによるものです。

$変数を使用している別のライブラリがある場合、これを行うことができます。

var $j = jQuery.noConflict();
$j("#datepicker").datepicker();

また、JavaScriptインクルードが正しい順序になっていることを確認して、jqueryコアライブラリがjquery.uiの前に定義されるようにしてください。私はそれが問題を引き起こしてきました。

このエラーは通常、jQuery UIセットからファイルが欠落している場合に表示されます。

すべてのファイル、jQuery UIファイル、CSSおよび画像があり、それらがサーバー上の正しくリンクされたファイル/ディレクトリの場所にあることを再確認します。

jQuery“ $（”＃datepicker“）。datepickerは関数ではありません”

以下の3つのファイルをフォームの本文セクションの最後に配置することで問題を修正しました。

  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js" type="text/javascript"></script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="Stylesheet" type="text/css" />

競合があると思われる場合は、jQuery.noConflict()コードで使用できます。詳細はドキュメントにあります。

REFERENCING MAGIC-JQUERYのショートカット

常に完全な「jQuery」を入力したくない場合は、いくつかの代替ショートカットがあります。

jQueryを別のショートカットに再割り当てし var $j = jQuery;ます（これは、異なるライブラリを使用する場合に最適なアプローチです）次の手法を使用すると、$を永続的に上書きせずにコードブロック内で$を使用できます。

(function($) { /* some code that uses $ */ })(jQuery)

注：この手法を使用する場合、$がプロトタイプの$であることを期待するこのカプセル化された関数内でプロトタイプメソッドを使用できないため、そのブロックでjQueryのみを使用することを選択します。引数をDOM readyイベントに使用します。

jQuery(function($) { /*some code that uses $ */ });

注：繰り返しになりますが、そのブロック内ではPrototypeメソッドを使用できません

それはドキュメントの終わりからのものであり、あなたにとって役立つかもしれません

最初に明白なことをしてください：jquery-ui.jsファイルをうまく参照していますか？

firebugのネットワークタブを使用して、それがロードされているかどうか、またはWeb開発者ツールバーのInformation \ View JavaScriptコードを使用してみてください。

Firebugを使用して1）Javascriptエラーがないことを確認し、2）#datepicker要素がページに存在することを確認しましたか？

ほとんどの場合、datepicker呼び出しの前にエラーがあり、datepicker呼び出しの実行を妨げています。

この投稿はかなり古いことを知っていますが、参考のために、datepickerのバージョンを更新してこの問題を修正しました

何時間ものデバッグを避けるためにも、それを試す価値があります。

https://cdnjs.com/libraries/bootstrap-datepicker

私はこの問題を抱えていて、JS参照とコードをページの下部に移動してから、</body>タグで修正されました。

また、ファイルをダウンロードするディレクトリの権限も確認してください。なんらかの理由でこれをダウンロードしたとき、デフォルトではアクセスが許可されていないフォルダに保存されました！それが問題であることを理解するのに永遠にかかりましたが、私はディレクトリとその内容の許可を変更しなければなりませんでした-EVERYONE = READ ONLYに設定しました。今はうまくいきます。

私は最近この問題に遭遇しました-問題は、jQuery UIファイルをヘッドタグに含めていたということでしたが、私が使用していたTelerikライブラリーは、ボディタグの下部にjQueryを含めました（したがって、明らかにjQueryを再初期化してUIをアンロードします）以前にロードされたプラグイン）。

解決策は、jQueryが実際に含まれている場所を見つけ、その後にjQuery UIスクリプトを含めることでした。

同様の問題が発生しました。スクリプト参照を自己終了タグ（つまり<script src=".." />）から空のノード（つまり<script src=".."></script>）に変更すると、エラーがなくなり、突然jQuery UI関数を参照できました。

当時は、これが適切に閉じられていないことの頭脳であることに気づかなかった。（スレッドに出くわした誰かが同様の問題を抱えている可能性があるため、これを単に投稿しています。）

呼び出す前に一部のファイルはロードされません。

例：コード：

<%= javascript_include_tag "distpicker.min" %>
<%= javascript_include_tag "distpicker.data.min" %>

これに変更：

<%= javascript_include_tag "distpicker.data.min" %>
<%= javascript_include_tag "distpicker.min" %>

_Layout.cshtmlのjqueryバンドルを削除するこの問題を修正できます

ヘッダ

    <script src="~/Scripts/jquery-1.10.2.js"></script>
    <script src="~/Scripts/kendo/2015.2.902/kendo.all.min.js"></script>
    ...

フッター

    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)

フッターを

    @Scripts.Render("~/bundles/bootstrap")
    @RenderSection("scripts", required: false)

$（ "＃<％= txtDateElementId.ClientID％>"）。datepicker（）;を使用してみましたか？$（ "＃txtDateElementId"）。datepicker（）;の代わりに JQueryを使用してIDで要素を選択するとき。

私の場合、次のスクリプトのインポート順を変更することで解決しました：以前（動作しません）：

後（作業中）：