我的 javascript 返回此错误:$.ajax 不是函数 [英] My javascript is returning this error: $.ajax is not a function

查看：28
本文介绍了我的 javascript 返回此错误:$.ajax 不是函数的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

不知道出了什么问题，但我从我的 chrome 控制台收到此错误: 

jquery-3.2.1.slim.min.js:1244 jQuery.Deferred 异常:$.ajax 不是函数 TypeError:$.ajax 不是函数在 HTMLDocument.<匿名>(file:///C:/Users/Adam/Desktop/UseTime/js/example.js:3:7)在 j (file:///C:/Users/Adam/Desktop/UseTime/js/jquery-3.2.1.slim.min.js:1193:55)在 k (file:///C:/Users/Adam/Desktop/UseTime/js/jquery-3.2.1.slim.min.js:1199:45) 未定义r.Deferred.exceptionHook @ jquery-3.2.1.slim.min.js:1244jquery-3.2.1.slim.min.js:1247 Uncaught TypeError: $.ajax 不是函数在 HTMLDocument.<匿名>(example.js:3)在 j (jquery-3.2.1.slim.min.js:1193)在 k (jquery-3.2.1.slim.min.js:1199)

来自这个 JavaScript:

$(function() {//当DOM准备好时变数；//声明全局变量$.ajax({//设置请求beforeSend: function (xhr) {//请求数据之前if (xhr.overrideMimeType) {//如果支持xhr.overrideMimeType("application/json");//设置 MIME 以防止错误}}});//从json文件中收集数据的函数function loadTimetable() {//decalre 函数$.getJSON('data/example.json')//尝试收集json数据.done(function (data) {//如果成功时间 = 数据；//存储在变量中}).fail(function () {//如果有问题:显示消息$('#event').html('对不起！我们现在无法加载您的时间表');});}加载时间表()；//调用函数//点击事件加载时间表$('#content').on('click', '#event a', function (e) {//用户点击位置e.preventDefault();//阻止加载页面var loc = this.id.toUpperCase();//获取id attr的值var newContent = "";for (var i = 0; i < times[loc].length; i++) {//遍历会话newContent += '
  • '+ 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('
      ' + newContent + '
    ');//显示时间$('#event a.current').removeClass('current');//更新选中的链接$(this).addClass('current');$('#details').text('');});//点击一个会话来引导描述$('#content').on('click', '#sessions li a', function (e) {//点击会话e.preventDefault();//防止加载var fragment = this.href;//标题在href中fragment = fragment.replace('#', '#');//在#前加空格$('#details').load(fragment);//加载信息$('#sessions a.current').removeClass('current');//更新选择});//点击主导航$('nav a').on('click', function (e) {//点击导航e.preventDefault();//防止加载var url = this.href;//获取UR:加载$('nav a.current').removeClass('current');$(this).addClass('current');$('#container').remove();//删除旧的$('#content').load(url + '#container').hide().fadeIn('slow');//添新});});

    • 我不确定这是我启动 .ajax 的方式的问题，还是我的 jquery 没有正确实现.我觉得是这样的.有什么想法吗?

    这是上面脚本的html

    <身体><标题><h1>使用时间</h1><导航><a href="jq-load.html">首页</a><a href="jq-load.html2">PROFILE</a><a href="jq-load.html4">管理任务</a><a href="usetime.html">时间表</a></nav></标题><section id="内容"><div id="容器"><div class="第三个"><div id="事件"><a id="class1" href="class1.html"><img src="" alt="class1"/>1类</a><a id="class2" href="class2.html"><img src="" alt="class2"/>2类</a><a id="class3" href="class3.html"><img src="" alt="class3"/>第 3 类 </a>

    <div class="第三个"><div id="会话">从左侧选择一个类 </div>

    <div class="第三个"><div id="详细信息">详情

    <!-- 容器--></节><!-- 内容--><script src="js/jquery-3.2.1.slim.min.js"></script><script src="js/example.js"></script>

    解决方案

    您正在使用 jQuery 的精简版.它不支持ajax调用.使用

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

    代替它.

    <块引用>

    苗条身材

    有时您不需要 ajax，或者您更喜欢使用其中一种专注于 ajax 请求的独立库.而且经常是更简单地将 CSS 和类操作的组合用于所有你的网络动画.连同常规版本的 jQuery包括 ajax 和效果模块，我们已经发布了一个slim"版本不包括这些模块.总而言之，它排除了ajax，效果，和目前已弃用的代码.jQuery 的大小很少是一个这些天负载性能受到关注，但纤薄的构建约为 6kgzip 压缩后的字节数小于常规版本 – 23.6k 与 30k.这些文件也可以在 npm 包和 CDN 上找到:

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

    引用自 jQuery 博客

    Not sure what's wrong but I'm getting this error from my chrome console: 

    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)

    From this JavaScript:

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

    I'm not sure if it's an issue with the way I'm initiating .ajax or if my jquery isn't correctly implemented. I think it is. Any Thoughts?

    edit: here's the html that goes with the script above

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

    解决方案

    You are using slim version of jQuery. It Doesn't support ajax Calling. Use 

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

    instead of it.

    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

    Referred from jQuery Blog

    这篇关于我的 javascript 返回此错误:$.ajax 不是函数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

    查看全文
    相关文章
    前端开发最新文章
    热门教程
    热门工具
    登录 关闭
    扫码关注1秒登录
    发送“验证码”获取 | 15天全站免登陆