2017-05-27 13 views
17

emin değil neyin var ama benim krom konsolundan bu hatayı alıyorum: Bu JavaScript itibaren

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) 

:

$(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 
    }); 
}); 

Başlattığım yöntemle ilgili bir sorun olup olmadığına emin değilim .Jaax veya jquery'm düzgün bir şekilde uygulanmadıysa. Sanirim oyle. Düşüncesi olan var mı?

düzenleme: Burada Sen jQuery ince sürümünü kullanıyorsanız

<!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

Your Kanununda herhangi jQuery bağlantısı mı deneyin ?? ? Jquery'yi başka bir javascript'ten önce bağlayın. işe yarayabilir. – AdhershMNair

+1

yea yea bunu html olarak adlandırıyor, ben onu – Adamwuh

cevap

63

yukarıdaki komut dosyası ile gider html var. Ajax Çağrısını desteklemiyor. Bunun yerine,

kullanı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 

ajax desteklemediği jQuery Blog

+1

ohhhh içine atacağım, bunu anlamıyordum, bu mantıklı, bunu deneyeceğim. Teşekkürler – Adamwuh

+0

Birçoğunuz buradan bakın. https://blog.jquery.com/2016/09/22/jquery-3-1-1-released/ – AdhershMNair

7

jQuery 3 ince versiyonundan anılacaktır. release docs göre

,

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.

sadece tam sürümünü birini kullanmak, .ajax yöntemi kullanmak için.

bu bir (jquery-3.2.1.min.js) yerine ince (jquery-3.2.1.slim.min.js)

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