2017-05-27 32 views
17

Không chắc có chuyện gì nhưng tôi nhận được lỗi này từ chrome console của tôi:

jquery-3.2.1.slim.min.js:1244 jQuery.Deferred exception: $.ajax is not a function TypeError: $.ajax is not a function 
    at HTMLDocument.<anonymous> (file:///C:/Users/Adam/Desktop/UseTime/js/example.js:3:7) 
    at j (file:///C:/Users/Adam/Desktop/UseTime/js/jquery-3.2.1.slim.min.js:1193:55) 
    at k (file:///C:/Users/Adam/Desktop/UseTime/js/jquery-3.2.1.slim.min.js:1199:45) undefined 
r.Deferred.exceptionHook @ jquery-3.2.1.slim.min.js:1244 
jquery-3.2.1.slim.min.js:1247 Uncaught TypeError: $.ajax is not a function 
    at HTMLDocument.<anonymous> (example.js:3) 
    at j (jquery-3.2.1.slim.min.js:1193) 
    at k (jquery-3.2.1.slim.min.js:1199) 

Từ JavaScript này:

$(function() { //when the DOM is ready 
    var times; //declare global variable 
    $.ajax({ //set up request 
     beforeSend: function (xhr) { //before requesting data 
      if (xhr.overrideMimeType) { //if supported 
       xhr.overrideMimeType("application/json"); // set MIME to prevent errors 
      } 
     } 
    }); 
    //funciton that collect data from the json file 
    function loadTimetable() { //decalre function 
     $.getJSON('data/example.json') //try to collect json data 
      .done(function (data) { //if succesful 
       times = data; //store in variable 
      }).fail(function() { //if a problem: show message 
       $('#event').html('Sorry! we couldnt load your time table at the moment'); 
      }); 
    } 
    loadTimetable(); //call the function 

    //CLICK ON TEH EVENT TO LOAD A TIME TABLE 
    $('#content').on('click', '#event a', function (e) { //user clicks on place 
     e.preventDefault(); //prevent loading page 
     var loc = this.id.toUpperCase(); //get value of id attr 
     var newContent = ""; 
     for (var i = 0; i < times[loc].length; i++) { // loop through sessions 
      newContent += '<li><span class = "time">' + times[loc][i].time + '</span>'; 
      newContent += '<a href = "descriptions.html#'; 
      newContent += times[loc][i].title.replace(/ /g, '-') + '">'; 
      newContent += times[loc][i].title + '</a></li>'; 
     } 
     $('#sessions').html('<ul>' + newContent + '</ul>'); // Display Time 
     $('#event a.current').removeClass('current'); // update selected link 
     $(this).addClass('current'); 
     $('#details').text(''); 
    }); 

    //CLICK ON A SESSION TO LEAD THE DESCRIPTION 
    $('#content').on('click', '#sessions li a', function (e) { //click on session 
     e.preventDefault(); // prevent loading 
     var fragment = this.href; //title is in href 
     fragment = fragment.replace('#', ' #'); //Add Space before # 
     $('#details').load(fragment); //to load info 
     $('#sessions a.current').removeClass('current'); //update selected 
    }); 

    //CLICK ON PRIMARY NAVIGATION 
    $('nav a').on('click', function (e) { //click on nav 
     e.preventDefault(); //prevent loading 
     var url = this.href; //get UR: to load 
     $('nav a.current').removeClass('current'); 
     $(this).addClass('current'); 
     $('#container').remove(); //remove old 
     $('#content').load(url + ' #container').hide().fadeIn('slow'); // add new 
    }); 
}); 

Tôi không chắc đó có phải là vấn đề với cách tôi đang khởi tạo .ajax hoặc nếu jquery của tôi không được triển khai đúng. Tôi nghĩ rằng nó là. Bất kỳ suy nghĩ nào?

chỉnh sửa: đây là html mà đi với kịch bản trên

<!DOCTYPE html> 

<body> 
    <header> 
     <h1>UseTime</h1> 
     <nav> 
      <a href="jq-load.html">HOME</a> 
      <a href="jq-load.html2">PROFILE</a> 
      <a href="jq-load.html4">MANAGE TASKS</a> 
      <a href="usetime.html">TIME TABLE</a> 
     </nav> 
    </header> 
    <section id="content"> 
     <div id="container"> 
      <div class="third"> 
       <div id="event"> 
        <a id="class1" href="class1.html"><img src="" alt="class1" /> Class 1 </a> 
        <a id="class2" href="class2.html"><img src="" alt="class2" /> Class 2 </a> 
        <a id="class3" href="class3.html"><img src="" alt="class3" /> Class 3 </a> 
       </div> 
      </div> 
      <div class="third"> 
       <div id="sessions"> Select a Class from the left </div> 
      </div> 
      <div class="third"> 
       <div id="details"> Details </div> 
      </div> 
     </div> 
     <!-- container --> 
    </section> 
    <!-- content --> 

    <script src="js/jquery-3.2.1.slim.min.js"></script> 
    <script src="js/example.js"></script> 
</body> 
+0

Bạn có liên kết bất kỳ jQuery để Mã của bạn ?? ? Liên kết Jquery trước bất kỳ javascript nào khác. nó có thể hoạt động. – AdhershMNair

+1

yea yea nó trong html mà các cuộc gọi này, tôi sẽ ném nó lên vào bài – Adamwuh

Trả lời

63

Bạn đang sử dụng phiên bản mỏng của jQuery. Nó không hỗ trợ gọi ajax. Sử dụng

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 

thay vì nó.

Slim build

Sometimes you don’t need ajax, or you prefer to use one of the many standalone libraries that focus on ajax requests. And often it is simpler to use a combination of CSS and class manipulation for all your web animations. Along with the regular version of jQuery that includes the ajax and effects modules, we’ve released a “slim” version that excludes these modules. All in all, it excludes ajax, effects, and currently deprecated code. The size of jQuery is very rarely a load performance concern these days, but the slim build is about 6k gzipped bytes smaller than the regular version – 23.6k vs 30k. These files are also available in the npm package and on the CDN:

https://code.jquery.com/jquery-3.1.1.slim.js 
https://code.jquery.com/jquery-3.1.1.slim.min.js 

giới thiệu từ jQuery Blog

+1

ohhhh Tôi didnt biết rằng, có ý nghĩa, tôi sẽ cung cấp cho rằng một thử. Cảm ơn – Adamwuh

+0

Bạn có nhiều người giới thiệu nó từ đây. https://blog.jquery.com/2016/09/22/jquery-3-1-1-released/ – AdhershMNair

7

jQuery 3 phiên bản mỏng không hỗ trợ ajax.

Theo release docs,

Along with the regular version of jQuery that includes the ajax and effects modules, we’re releasing a “slim” version that excludes these modules. All in all, it excludes ajax, effects, and currently deprecated code.

Để sử dụng .ajax phương pháp, chỉ cần sử dụng phiên bản đầy đủ nhất.

Hãy thử này (jquery-3.2.1.min.js) thay vì mỏng (jquery-3.2.1.slim.min.js)

<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> 
Các vấn đề liên quan