JQuery-$가 정의되지 않았습니다

486

간단한 jquery 클릭 이벤트가 있습니다

<script type="text/javascript">
    $(function() {
        $('#post').click(function() {
            alert("test"); 
        });
    });
</script>

site.master에 정의 된 jquery 참조

<script src="<%=ResolveUrl("~/Scripts/jquery-1.3.2.js")%>" type="text/javascript"></script>

스크립트가 올바르게 해결되고 있는지 확인했습니다. 마크 업을보고 Firebug에서 직접 스크립트를 볼 수 있으므로 찾아야합니다. 그러나 나는 여전히 얻고있다 :

$가 정의되지 않았습니다

그리고 jquery가 작동하지 않습니다. 또한 $ (document) .ready 및 jQuery 등과 같은 다양한 변형을 시도했습니다.

.net 3.5의 MVC 2 앱입니다 .Google의 모든 곳에서 파일이 올바르게 참조되었는지 확인한다고 말하면 다시 확인하고 다시 확인하십시오. : /

javascript  jquery  asp.net-mvc 
— 폴 크레이 세이
소스
6
Fiddler 도구로 페이지로드를 검사하면 실제로 jquery-1.3.2.js가 요청하고 HTTP200 응답 코드가로드 된 것을 볼 수 있습니까?
— naivists
18
jquery 전에 스크립트가 실행되고 있습니까?
— Surya
2
소스를보고 js 링크를 클릭 할 수 있습니까? jquery가 페이지에로드되지 않은 것 같습니다. Firebug Console 화면에서 오류를 확인 하십시오. 스크립트 태그에서 ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js 를 시도하십시오
— nemke
2
jquery 소스가로드되기 전에 스크립트가 실행됩니까?
— Dave Bacher
1
@ Surya / Dave, 나는 지금 집에 갔다. 그래서 나는 내일 다시 체크 아웃하고 돌아와서 게시 할 것이다.
— Paul Creasey 2019

답변:

560

이 오류는 다음 세 가지 중 하나에 의해서만 발생할 수 있습니다.

  1. 자바 스크립트 파일이 페이지에 제대로로드되지 않았습니다
  2. 봇치 버전의 jQuery가 있습니다. 누군가 코어 파일을 편집했거나 플러그인이 $ 변수를 덮어 써서 발생할 수 있습니다.
  3. 페이지가 완전히로드되기 전에 그리고 jQuery가 완전히로드되기 전에 JavaScript가 실행 중입니다.

우선, 어떤 스크립트가 올바르게 호출되는지 확인하십시오.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

그리고 async 또는 defer 속성이 없어야합니다 .

그런 다음 Firebug net 패널을 검사하여 파일이 실제로 제대로로드되는지 확인해야합니다. 그렇지 않으면 빨간색으로 강조 표시되고 옆에 "404"라고 표시됩니다. 파일이 제대로로드되면 문제가 2 번임을 의미합니다.

모든 jQuery 자바 스크립트 코드가 다음과 같은 코드 블록 내에서 실행되고 있는지 확인하십시오.

$(document).ready(function () {
  //your code here
});

그러면 jQuery가 초기화 된 후 코드가로드 됩니다.

마지막으로 확인해야 할 것은 jQuery를로드 하기 전에 플러그인 을로드 하지 않는지 확인하는 것 입니다. 플러그인은 "$"객체를 확장하므로 jQuery 코어를로드하기 전에 플러그인을로드하면 설명 된 오류가 발생합니다.

참고 : jQuery를 실행할 필요가없는 코드를로드하는 경우 jQuery 준비 핸들러 내에 배치 할 필요가 없습니다. 이 코드는을 사용하여 분리 될 수 있습니다 document.readyState.

— 마이크 Trpcic
소스
182
코드 블록에 관해서 $(document)는, 그 문장 앞에 jQuery를 포함하는 스크립트 태그가 없으면 작동하지 않습니다 ...
— PatrikAkerstrand
3
OP와 동일한 문제가 있으며 jquery의 라이브러리와 함께 https를 사용하면 제대로 작동하지 않는다는 문제가 있습니다.
— Mike Cheel
20
(function ($) {}) (jQuery);
— JackMahoney
2
@Patrik :보기의 스크립트 섹션을 사용하여 솔루션에 대한 내 대답을 참조하십시오. 이 방법으로 jquery가 먼저로드되고 $가 올바르게 정의됩니다.
— angularsen
1
스크립트에서 비동기가 있는지 확인하십시오. 그래서 제 문제가 발생했습니다.
— Anders
207

jquery 스크립트가 호출되기 전에 스크립트 태그가 호출되었을 수 있습니다.

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

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

$가 정의되지 않은 결과

jquery.js를 스크립트 태그 앞에 넣으면 다음과 같이 작동합니다.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript" src="js/script.js"></script>
— 행키 팬키
소스
1
이것은 큰 반응입니다. 나는 그것을 시도했고 그것은 나를 위해 일했다. VS 2013 및 ASP.net을 사용하고 있습니다. asp.net에서 페이지가 자동으로로드되기 전에 자바 스크립트를로드하는 방법을 알고 있습니까? 아니면 모든 파일 에서이 방법으로 자바 스크립트를 참조해야합니까?
— Pat
답변에 추가하십시오. ASP.net에서 Shared_Layout.cshtml`<head> </ head>`
— Pat
@pat 그리고 @section Scripts태그 안에 코드를 작성하십시오
— Marc
업데이트 대답은 HTTPS를 사용하여 SPI의 사용 고려하시기 바랍니다 devdocs.io/html/attributes#integrity-attribute
— 조쉬 Habdas
65

먼저 jQuery 스크립트가로드되어 있는지 확인해야합니다. CDN 또는 웹 사이트의 로컬 일 수 있습니다. jQuery를 사용하기 전에 이것을 먼저로드하지 않으면 jQuery가 정의되지 않았다는 메시지가 나타납니다.

<script src="jquery.min.js"></script>

이것은 HEAD 또는 페이지 바닥 글에있을 수 있습니다. 다른 jQuery를 호출하기 전에로드해야합니다.

그런 다음 아래 두 가지 솔루션 중 하나를 사용해야합니다.

(function($){
// your standard jquery code goes here with $ prefix
// best used inside a page with inline code, 
// or outside the document ready, enter code here
 })(jQuery);

또는

jQuery(document).ready(function($){
// standard on load code goes here with $ prefix
// note: the $ is setup inside the anonymous function of the ready command
});

여러 번 $ (document) .ready (function () {// code here}); 작동 안 할 것이다.

— 앤드류 킬렌
소스
1
"jQuery가 정의되지 않았습니다". 그러나 페이지로드 후에 존재합니다.
— Paul Totzke
이것이 질문인지 진술인지 확실하지 않지만 사용하기 전에 jQuery 스크립트를 호출하는지 확인합니다. 바닥 글에로드하고 페이지 위로 물건을 호출하는 것처럼 들립니다.
— Andrew Killen
죄송합니다. 이것이 스크립트를 어떤 순서로든 사용할 수있는 기술이라고 생각했습니다. 예, MVC 스타일의 본문 섹션에서 이것을 사용했습니다. mycode.js와 jQuery.js는 페이지의 마지막 두 가지입니다.
— Paul Totzke
폴은 걱정할 필요가 없습니다. '먼저로드해야합니다. :)
— Andrew Killen 2016 년
"내 스크립트는 올바른 순서이지만 스크립트는 다른 순서로로드됩니다"문제를 해결합니까? 4 년 전에 이런 일을했던 것을 기억하지만 어떤 문제가 해결되었는지는 기억할 수 없습니다.
— Paul Totzke
50

jQuery 플러그인 호출이 옆에 있고 </body>그 전에 스크립트가로드 된 window.onload경우 다음과 같이 이벤트 후에 코드를 실행해야 합니다.

window.onload = function() {
  //YOUR JQUERY CODE
}

`

따라서 코드는 모든 자산이로드되었을 때 창로드 후에 만 ​​실행됩니다. 이 시점에서 jQuery ( $)가 정의됩니다.

당신이 그것을 사용하는 경우 :

$(document).ready(function () {
  //YOUR JQUERY CODE
});

`

는 $아직이 jQuery를로드되기 전에 호출되며, 스크립트가 콘솔에서 첫 번째 줄에 실패하기 때문에,이 시점에서 정의되지 않습니다.

— 단다 페레이라
소스
일반적으로 window.unload에 묶는 것은 좋지 않습니다. 효과적으로 진행되는 유일한 이벤트가 될 것입니다 !!!
— Rudi Strydom
참고 : 하나의 window.onload 함수 만 할당 할 수 있습니다. 다른 함수를 할당하면 이전 함수는 실행되지 않습니다.
— Bruno Peres
28

방금 똑같은 일을했고 많은 것을 가지고 있음을 발견했습니다. 

type="text/javacsript"

그래서 그들은로드되었지만 왜 작동하지 않는지에 대한 추가 힌트는 없습니다. 말할 필요도없이, 올바른 철자가 그것을 고쳤습니다.

— 조지 R
소스
사회자 주 :이 글의 오타는 의도 를 잘 보여주기 위해 의도적 인 것입니다. 게시물을“수정”하여 수정하지 마십시오.
— Martijn Pieters
23

보기 및 마스터 레이아웃에서 스크립트 섹션 을 사용하십시오 .

보기에 정의 된 모든 스크립트를보기의 스크립트 섹션 안에 넣으십시오. 이런 식으로 다른 모든 스크립트가로드 된 후 마스터 레이아웃에이를로드 할 수 있습니다. 새 MVC5 웹 프로젝트를 시작할 때의 기본 설정입니다. 이전 버전에 대해 잘 모르겠습니다.

Views / Foo / MyView.cshtml :

// The rest of your view code above here.

@section Scripts 
{ 
    // Either render the bundle defined with same name in BundleConfig.cs...
    @Scripts.Render("~/bundles/myCustomBundle")

    // ...or hard code the HTML.
    <script src="URL-TO-CUSTOM-JS-FILE"></script>

    <script type="text/javascript">
      $(document).ready(function () {

        // Do your custom javascript for this view here. Will be run after 
        // loading all the other scripts.            
      });
    </script>
}

조회수 / 공유 /_Layout.cshtml

<html>
<body>
    <!-- ... Rest of your layout file here ... -->

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

마스터 섹션 파일에서 스크립트 섹션이 마지막으로 렌더링되는 방법에 유의 하십시오.

— 앵 굴라
소스
2
참고 : 뷰 섹션은 의도적으로 부분 뷰에서 지원되지 않습니다.
— Adam Naylor
이것은 내 수정을 위해해야했던 일입니다 .... @Scripts를 처음 사용하는 것이 더 좋았지 만 수정을 찾을 때까지 잊어 버렸습니다.
— Caverman
12

실제로 jquery를로드해야합니다 .jquery가 아닙니다 -UI입니다!

  <script language="JavaScript" 
    src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.0/jquery-ui.min.js">
  </script>

이것은 jquery에 대한 올바른 스크립트 소스입니다.

 <script language="JavaScript"  src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.0/jquery.min.js"></script>
— 볼프강 팔
소스
11

위에서 언급했듯이 $ 변수의 충돌로 인해 발생합니다.

충돌없이 jQuery에 대한 보조 변수를 예약 하여이 문제를 해결했습니다.

var $j = jQuery.noConflict();

그런 다음 어디서나 사용하십시오

$j( "div" ).hide();

자세한 내용은 여기를 참조 하십시오

— 본당 압바스
소스
8

jQuery 라이브러리가 아직로드되지 않았 음을 의미합니다.

jQuery 라이브러리를 가져온 후 코드를 이동할 수 있습니다.

또는 이런 식으로 사용할 수 있습니다

window.onload = function(){
  // Your code here
};
— 네 사르
소스
이것은 DOM 이로 드 된 후에 발생하지만 백그라운드에서 실행되는 컨트롤, 자바 스크립트 및 기타 프로그램은로드되지 않습니다. 이를 위해서는 시간 지연이 필요합니다.
— Fandango68
5

일부 테스트 후 빠른 솔루션을 찾은 후에 색인 페이지 위에 추가 할 수 있습니다.

<script>
$=jQuery;
</script>

그것은 아주 잘 작동합니다 :)

— 미모 우니
소스
4
질문은 : $ 정의되지 않았습니다, 아니?
— Mimouni
잡히지 않은 ReferenceError : jQuery가 정의되지 않았습니다
— Simon Schnell
jQuery 라이브러리 가져 오기 바로 아래에 넣었습니까?
— Mike Warren
4

jQuery 참조의 철자가 틀렸을 때 type="text/javascript""... javascirpt"를 입력하는 대신 같은 오류 메시지가 나타납니다 . ;)

— 앨런
소스
유레카! 나는로 내했다 type="text/css". 내 정신을 구해 주셔서 감사합니다!
— Jeriko
나는 멍청하고 있었다 type="javascript". 그것을 찾는 데 30 분이 걸렸습니다.
— 메이슨
4

jQuery가 제대로로드되지 않는 것 같습니다. 어떤 소스 / 버전을 사용하고 있습니까?

또는 네임 스페이스 충돌 일 수 있으므로을 사용하는 대신 명시 적으로 jQuery를 사용해보십시오 $. 그래도 문제가 해결 되지 않으면 noConflict사용중인 다른 코드가 $중단되지 않도록 하는 것이 좋습니다.

— Alexender Dumma
소스
3

이 오류는 jQuery가 아직 페이지에로드되지 않았 음을 의미합니다. jQuery 함수 $(document).ready(...)와 마찬가지로 사용 하거나 변형 하면 좋지 않습니다 $.

사용 window.onload은 여기에서 작동합니다. 에 하나의 기능 만 할당 할 수 있습니다 window.onload. 원래의 온로드 로직을 잃지 않도록 다음과 같이 원래 기능을 꾸밀 수 있습니다.

originalOnload = window.onload;
window.onload = function() {
  if (originalOnload) {
    originalOnload();
  }
  // YOUR JQUERY
};

이것은 원래에 할당 된 기능을 window.onload실행 한 다음 실행 // YOUR JQUERY됩니다.

데코레이터 패턴에 대한 자세한 내용은 https://en.wikipedia.org/wiki/Decorator_pattern 을 참조 하십시오 .

— 카일 맥베이
소스
2

Url.Content를 사용 하며 문제가 없습니다.

<script src="<%= Url.Content ("~/Scripts/jquery-1.4.1.min.js") %>" type="text/javascript"></script>
— mdm20
소스
2

솔루션에서 언급 된 것은 "최종 확인해야 할 것은 jQuery를로드하기 전에 플러그인을로드하지 않는지 확인하는 것입니다. 플러그인은"$ "오브젝트를 확장하므로 jQuery 코어를로드하기 전에 플러그인을로드하면 '설명한 오류가 나타납니다. "

이것을 피하기 위해-

많은 JavaScript 라이브러리는 jQuery와 마찬가지로 $를 함수 또는 변수 이름으로 사용합니다. jQuery의 경우 $는 jQuery의 별칭 일 뿐이므로 $를 사용하지 않고도 모든 기능을 사용할 수 있습니다. jQuery와 함께 다른 JavaScript 라이브러리를 사용해야하는 경우 $ .noConflict ()를 호출하여 $의 제어를 다른 라이브러리로 되돌릴 수 있습니다.

1

명백한 이유 없이이 문제가 한 번있었습니다. aspnet 개발 서버를 실행하는 동안 로컬에서 발생했습니다. 그것은 작동하고 있었고 이전에는 작동했지만 여전히 작동하지 않는 상태로 모든 것을 되돌 렸습니다. 크롬 디버거를보고 jquery-1.7.1.min.js가 아무런 문제없이로드되었습니다. 모두 매우 혼란 스러웠습니다. 나는 여전히 문제가 무엇인지 알지 못하지만 브라우저를 닫고 개발 서버를 닫은 다음 다시 시도했습니다.

— cedd
소스
1

jquery URL을 jquery 코드 상단에 배치하십시오.

이렇게

<script src="<%=ResolveUrl("~/Scripts/jquery-1.3.2.js")%>" type="text/javascript"></script>

<script type="text/javascript">
    $(function() {
        $('#post').click(function() {
            alert("test"); 
        });
    });
</script>
— 비란 트
소스
1

나는 같은 문제가 있었고 jQuery.js에 대한 내 참조가 태그에 없기 때문에 발생했습니다. 일단 전환하면 모든 것이 작동하기 시작했습니다.

앤서니

— 앤서니
소스
1

  1. jquery 파일의 정확한 경로가 포함되어 있는지 확인하십시오.

    <script src="assets/plugins/jquery/jquery.min.js"></script>

페이지 하단에 이것을 추가하면이 선언 아래의 모든 JS 함수를 호출하십시오.

  1. 이 코드 테스트를 사용하여 확인하십시오.

    <script type="text/javascript">
/***
 * Created by dadenew
 * Submit email subscription using ajax
 * Send email address
 * Send controller
 * Recive response
 */
$(document).ready(function() { //you can replace $ with Jquery

  alert( 'jquery working~!' );
});

평화!

— 다니엘 아데 뉴
소스
0

우리는 같은 문제가 있습니다 .... 실수로 폴더 속성을 확인하고 무언가를 설정했습니다 ...

액세스하는 각 폴더의 속성을 확인해야합니다.

  1. 폴더를 마우스 오른쪽 버튼으로 클릭
  2. '권한'탭
  3. 폴더 액세스 설정 : 소유자 : 파일 작성 및 삭제 그룹 : 파일 액세스 기타 : 파일 액세스

이것이 해결책이기를 바랍니다 ......

— RoyS_philippines
소스
0

asp.net에서 jQuery를 사용할 때 마스터 페이지를 사용 중이고 여기에서 jquery 소스 파일을로드하는 경우 모든 jquery 스크립트 참조 뒤에 헤더 contentplaceholder가 있는지 확인하십시오.

jquery 객체가 생성되기 전에 잘못된 순서로 클라이언트 쪽 코드를 실행했기 때문에 해당 마스터 페이지를 사용한 페이지가 '$ 정의되지 않음'을 반환하는 문제가 발생했습니다. 그래서 당신이 가지고 있는지 확인하십시오 :

<head runat="server">
    <script type="text/javascript" src="Scripts/jquery-VERSION#.js"></script>
    <asp:ContentPlaceHolder id="Header" runat="server"></asp:ContentPlaceHolder>
</head>

그렇게하면 코드가 순서대로 실행되고 자식 페이지에서 jQuery 코드를 실행할 수 있습니다.

— 프랜시스 무시 냑
소스
0

필자의 경우 Google에서 호스팅하는 JQuery를 가리키고있었습니다. 제대로 포함되었지만 HTTPS 페이지에 있었고 HTTP를 통해 호출했습니다. 문제를 해결하거나 안전하지 않은 내용을 허용하면 바로 시작되었습니다.

— 앤서니
소스
0

나는이 같은 문제를 겪고 있었고 그 원인을 알 수 없었습니다. 최근에 HTML 파일을 일본어에서 UTF-8로 변환했지만 스크립트 파일로는 아무 작업도하지 않았습니다. 어떻게 든 jquery-1.10.2.min.js 가이 프로세스에서 손상되었습니다 (아직도 방법을 모릅니다). jquery-1.10.2.min.js를 원래 수정 된 것으로 바꾸십시오.

— 개빈
소스
0

jquery.js 파일을 동일한 폴더 또는 html 파일이있는 일부 하위 폴더에서 찾으면 Firebug 문제가 해결 된 것으로 보입니다. 예를 들어 html이 C : / folder1 /에 있으면 js 파일이 C : / folder1 / (또는 C : / folder1 / folder2 등) 아래에 있어야하며 html 문서에서 적절히 처리해야합니다. 도움이 되었기를 바랍니다.

— sc123
소스
0

나는 같은 문제가 있으며 어떤 경우에도 문제를 해결할 수 없습니다. 나를 위해 유일한 것은 Site.master 파일의 다음에 있습니다.

<script src="<%= ResolveUrl("~/Scripts/jquery-1.7.1.min.js") %>" type="text/javascript"></script>
<script src="<%= ResolveUrl("~/Scripts/bootstrap/js/bootstrap.min.js") %>" type="text/javascript"></script>

src = "<% = ResolveUrl (" ") ...을 사용하면 콘텐츠 페이지에 jQuery가 올바르게로드됩니다.

— 아멜리아
소스
0

나는 매우 비슷한 문제가 있었다. 내 C # MVC 응용 프로그램에서 JQuery가 인식되지 않았습니다. @ Scripts.Render ( "~ / bundles / jquery")를 _Layout.cshtml 파일의 맨 아래에서 섹션 헤드로 이동해야했습니다. 또한 Visual Studio를 사용하는 경우 Jquery를 Nuget 패키지로 가져와야합니다!

<head>
    @Scripts.Render("~/bundles/jquery")
</head>
— BHOW
소스
0

나머지 코드가 실행되기 전에 자바 스크립트를 자동으로로드하는 방법이 있습니다.

Views \ Shared_Layout.html로 이동하여 다음을 추가하십시오. 

<head>
  <*@ Omitted code*@>
  <script src="~/Scripts/jquery-1.10.2.min.js" type="text/javascript"></script>
</head>
— 가볍게 두드리기
소스
0

경우 script태그가 defer속성이 오류를 보여

잡히지 않은 ReferenceError : $가 정의되지 않았습니다

태그 에서 속성 defer을 제거해야합니다script

— 압둘 아마드 마틴
소스
0

이 문제를 해결하기위한 일반적인 문제입니다.

  1. 기본 Jquery 라이브러리 포함
  2. 크로스 브라우저 문제 확인
  3. jquery 코드 상단에 라이브러리 추가
  4. CDN이 차단되어 있는지 확인하십시오.

자세한 내용은이 블로그에 나와 있습니다. 여기를 클릭하십시오.

— 안주 바타
소스
당사 사이트를 사용함과 동시에 당사의 쿠키 정책과 개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.