javascript - 如何用 jQuery ajax 替换 javascript ajax?

标签 javascript jquery ajax

<分区>

我想做什么?
我正在考虑将 javascript ajax 更改为 jQuery ajax。它看起来更短,而且我看到很多人在使用它,但我无法真正让它工作。

到目前为止我有什么?
我有一个元素:
<li id="unique_id" onmousedown="check_element(event, this)">1</li>
当我点击该元素时,它检查按下了哪个键,如果它的 mouse1 然后检查元素的背景。如果元素没有背景颜色,它会将其更改为“红色”,并使用 ajax 将元素的 id 添加到 MySQL 数据库。 如果它已经有红色背景(意味着它是之前添加的),它会使用 ajax 将其从数据库中删除。

代码
检查功能

function check_element(evt, e){
    if(evt.which == 1){
        if(e.style.background == "") {
            e.style.background = "red";
            send_with_ajax("add", e);
        } else {
            e.style.background = "";
            send_with_ajax("delete", e);
        }
    }
} 

Ajax(使用 javascript):

function send_with_ajax(action, e){
    var xmlhttp;
    if (window.XMLHttpRequest){
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    } 
    xmlhttp.open("GET","ajax/send_calendar.php?data="+e.id+"&action="+action+"",true);
    xmlhttp.send();
}

send_calendar.php 没什么特别的。只需从 $_GET[''] 中获取变量以及从数据库中插入或删除值。问题是,我如何更改此函数以使其成为 jQuery Ajax?

我尝试了什么?

function send_with_ajax(action, e){
    $.Ajax({
        type: "GET",
        url: "send_calendar.php",
        data: "data="+e.id+"&action="+action+"",
        success: function(msg){
            alert( "Data Saved: " + msg ); //never shows this alert
        }
    });
} 

我也得到错误:
Uncaught TypeError: Object function (a,b){return new e.fn.init(a,b,h)} has no method 'Ajax'

附言。以前从未使用过 jQuery Ajax,所以我不知道我做错了什么。

最佳答案

$.ajax (区分大小写),不是 $.Ajax

另请注意,data 选项接受一个对象作为输入,$.ajax 将自行执行参数序列化。

$.ajax({
    type: "GET",
    url: "ajax/send_calendar.php",
    data: {
        "data" : e.id,
        "action": action
    },
    success: function(msg) {
        alert("Data Saved: " + msg);
    }
});

GET 和 POST 请求也存在速记方法,.get().post()分别。

关于javascript - 如何用 jQuery ajax 替换 javascript ajax?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14590976/

相关文章:

javascript - 在 Safari 10.13.4 中发送包含空文件输入的 FormData() 时 AJAX 请求失败

javascript - 如何重用方法: define in main object and call from all component in VueJS

php - Ajax 通过 php 获取价格

c# - 允许用户使用 Ajax 下载文件

javascript - 多个 Javascript Ajax 调用阻塞了 UI (Laravel REST)

javascript - Draggable 不是一个函数 - 如何将draggable 添加为 jQuery UI 的扩展?

php - 如何过滤json数组中的元素?

javascript - MySQL 数据导入 FullCalendar

jquery - 鼠标移出时使用 jquery 隐藏 div

ruby-on-rails - 如何在同一个 View 中呈现两个分页和 ajaxable 集合?