jQuery UI“$ (”#datePicker”). DatePicker는 기능이 아닙니다”

Question

기존 .aspx 페이지에서 jQuery의 UI 플러그인, jQuery의 UI 플러그인 DatePicker를 사용하면 다음과 같은 오류가 발생합니다.

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

그러나 DatePicker를 생성하고 사용하는 동일한 코드를 ASPX 페이지와 동일한 디렉토리에있는 HTML 파일에 복사하여 붙여 넣으면 완벽하게 작동합니다. 이로 인해 ASPX 페이지에는 DatePicker 또는 JQuery의 UI JS 파일이 제대로로드되는 것을 방지하는 JS 파일이 있다고 가정합니다.

누구든지 내 믿음을 확인하거나 jQuery의 UI 플러그인을 방해하는 범인을 찾는 데 팁을 제공 할 수 있습니까?

Answer 1

나는 몇 시간 동안 비슷한 문제로 어려움을 겪었다. 그런 다음 jQuery가 사내 디버거에 jQuery 함수를 추가 한 프로그램에 의해 두 번 포함 된 것으로 나타났습니다.

Answer 2

$ 변수를 사용하는 다른 라이브러리가있는 경우 다음을 수행 할 수 있습니다.

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

또한 JavaScript가 올바른 순서에 있는지 확인하므로 jQuery Core 라이브러리가 jQuery.ui 앞에 정의됩니다. 나는 그 원인 문제가있었습니다.

Answer 3

이 오류는 일반적으로 jQuery UI 세트에서 파일이 없으면 나타납니다.

모든 파일, jQuery UI 파일 및 CSS 및 이미지가 있고 서버에서 올바르게 연결된 파일/디렉토리 위치에 있음을 두 번 확인하십시오.

Answer 4

갈등이 있다고 생각되면 사용할 수 있습니다. jQuery.noConflict() 코드에서. 세부 사항은 문서.

마법 참조 - jQuery의 단축키

전체 "jQuery"를 항상 입력하는 것이 마음에 들지 않으면 몇 가지 대체 바로 가기가 있습니다.

jQuery를 다른 바로 가기에 재 할당하십시오 var $j = jQuery; (다른 라이브러리를 사용하려는 경우 이것은 최상의 접근법 일 수 있습니다.) 다음 기술을 사용하여 $ : 영구적으로 덮어 쓰지 않고 코드 블록 내부에서 $를 사용할 수 있습니다.

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

참고 :이 기술을 사용하는 경우 $가 프로토 타입의 $가 될 것으로 예상되는이 캡슐화 된 기능 내에서 프로토 타입 메소드를 사용할 수 없으므로 해당 블록에서 jQuery 만 사용할 수 있습니다. DOM Ready 이벤트에 대한 인수를 사용하십시오.

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

참고 : 다시 말하지만, 그 블록 내부에서 프로토 타입 방법을 사용할 수 없습니다.

문서의 끝에서 나와 유용 할 수 있습니다.

Answer 5

jQuery "$ ("#datePicker "). DatePicker는 기능이 아닙니다"

끝에 양식의 본문 섹션에 아래 세 개의 파일을 배치하여 문제를 해결했습니다.

  <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" />

Answer 6

명백한 첫 번째로 가십시오. jQuery-ui.js 파일을 잘 참조하고 있습니까?

FireBug의 네트워크 탭을 사용하여로드되었는지 또는 웹 개발자 도구 모음의 정보 javaScript 코드보기를 찾으십시오.

Answer 7

FireBug를 사용하여 1) JavaScript 오류가없고 2) #DatePicker 요소가 페이지에 존재한다고 판단 했습니까?

DatePicker 호출이 DatePicker 통화가 실행되는 것을 방지하는 DatePicker 호출 전에 오류가 발생했을 가능성이 높습니다.

Answer 8

이 게시물이 꽤 오래되었음을 알고 있지만 참고 로이 문제를 해결했습니다. DatePicker 버전 업데이트

몇 시간 동안 디버깅을 피하기 위해 시도해 볼 가치가 있습니다.

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

Answer 9

방금이 문제가 있었고 JS 참조 및 코드를 페이지 하단으로 이동했습니다. </body> 태그가 나를 위해 수정했습니다.

Answer 10

또한 파일을 다운로드하는 디렉토리에 대한 권한을 확인하십시오. 내가 이것을 다운로드했을 때 어떤 이유로, 기본적으로 액세스 할 수없는 폴더에 저장되었습니다! 그것이 문제라는 것을 알아내는 데 영원히 걸렸지 만, 디렉토리에 대한 허가를 변경해야했고 내용은 모든 사람 = 읽기만으로 설정했습니다. 지금 잘 작동합니다.

Answer 11

최근 에이 문제를 해결했습니다. 문제는 헤드 태그에 jQuery UI 파일을 포함 시켰지만 본체 태그의 맨 아래에 jQuery를 포함시킨 텔레릭 라이브러리 (따라서 jQuery를 다시 시작하고 UI를 언로드하는 것 같습니다. 이전에로드 된 플러그인).

해결책은 jQuery가 실제로 포함 된 위치를 알아 내고 그 후 jQuery UI 스크립트를 포함하는 것이 었습니다.

Answer 12

방금 비슷한 문제를 겪었습니다. 스크립트 참조를 자체 처리 태그에서 변경했을 때 (즉, <script src=".." />) 빈 노드 (즉, <script src=".."></script>) 내 오류가 사라지고 갑자기 jQuery UI 기능을 참조 할 수있었습니다.

당시, 나는 이것이 시작하기 위해 제대로 닫지 않는 두뇌의 단지 단지 두뇌라는 것을 알지 못했습니다. (스레드를 건너는 다른 사람이 비슷한 문제를 겪을 가능성에 대해 간단히 게시하고 있습니다.)

Answer 13

전화하기 전에 일부 파일이 없습니다.

예 : 코드 :

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

이것으로 변경 :

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

Answer 14

이 문제를 해결할 수 있습니다. _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)

Answer 15

$ ( "#< %= txtDateElementId.clientId %>"). datePicker ()를 사용해 보셨습니까? $ ( "#txtDateElementId") 대신 datePicker (); jQuery를 사용하여 ID로 요소를 선택할 때.