在 ajax 结果中获取此内容


Getting this in ajax result

im 尝试制作一个将 P 行更改为输入字段的脚本,让用户编辑它们,然后在通过 ajax 检查外部 PHP 文档后恢复为 p 行。但是问题似乎是我不能在ajax部分中使用它,它会破坏代码。我该如何解决这个问题?我需要发布 HTML 吗?

$(document).ready(function () {
    function changeshit(result, that) {
        if (result == "success") {
            $(that).closest('div').find('input').each(function () {

                var el_naam = $(that).attr("name");
                var el_id = $(that).attr("id");
                var el_content = $(that).attr("value");
                $(that).replaceWith("<p name='" + el_naam + "' id='" + el_id + "'>" + el_content + "</p>");
            });

            $(".editlink").replaceWith("<a href='"#_'" class='"editlink'" name='"edit'" id='"" + editid + "'">Bewerken</a>");
        } else {
            alert(result);
        }
    }

    $(".editinv").on('click', 'a', function () {
        var editid = $(this).attr("id");
        var edit_or_text = $(this).attr("name");
        if (edit_or_text == "edit") {

            $(this).closest('div').find('p').each(function () {
                var el_naam = $(this).attr("name");
                var el_id = $(this).attr("id");
                var el_content = $(this).text();
                $(this).replaceWith("<input type='text' name='" + el_naam + "' id='" + el_id + "' value='" + el_content + "' />");
            });

            $(".editlink").replaceWith("<a href='"#_'" class='"editlink'" name='"done'" id='"" + editid + "'">Klaar</a>");
        } else if (edit_or_text == "done") {

            var poststring = "";
            $(this).closest('div').find('input').each(function () {
                var el_naam = $(this).attr("name");
                var el_id = $(this).attr("id");
                var el_content = $(this).attr("value");
                poststring = poststring + '' + el_naam + '=' + el_content + '&';
            });
            poststring = poststring + 'end=end'
            $.ajax({
                url: 'http://' + document.domain + '/klanten/updateaddress.php',
                type: 'post',
                data: poststring,
                success: function (result, this) {
                    changeshit(result, this);

                }
            });
        }
    });
});

是的,常见的解决方案是声明一个 var 示例 self = this 并使用该变量

 var self = this;
 $.ajax({
            url: 'http://'+document.domain+'/klanten/updateaddress.php',
            type: 'post',
            data: poststring,
            success: function(result) {   
            changeshit(result, self);

            }
        });
    }

这样,此上下文将保存在变量中。

尝试以下操作:

$(".editinv").on('click', 'a', function () {添加

$(".editinv").on('click', 'a', function () {
    var element = this;

然后将其更改为:

$.ajax({
    url: 'http://' + document.domain + '/klanten/updateaddress.php',
    type: 'post',
    data: poststring,
    success: function (result) {
        changeshit(result, element);
    }
});

也就是说,如果我正确理解了您要做什么

如果您只是添加:

context: this

对于$.ajax选项,将自动调用success处理程序,其值为 this ,因此您不需要 that 参数。

然后,您也不再需要围绕success回调的额外函数包装器,因此您只需使用:

$.ajax({
    url: 'http://' + document.domain + '/klanten/updateaddress.php',
    type: 'post',
    data: poststring,
    context: this,       // propagate "this"
    success: changeshit  // just pass the func ref
});

几种方法可以实现此目的

1)如果你阅读文档(jQuery.ajax),你会发现你可以为ajax方法提供一个上下文

上下文类型:普通对象此对象将成为所有与 Ajax 相关的回调的上下文。默认情况下,上下文是一个对象 表示调用中使用的 ajax 设置 ($.ajaxSettings 合并) 将设置传递给 $.ajax)。

$.ajax({
    url: 'http://'+document.domain+'/klanten/updateaddress.php',
    type: 'post',
    data: poststring,
    context: this,
    success: function(result) {   
        // the context sent above would become the context of this function when called by jquery
        changeshit(result, this);
    }
});

以这种方式使用它,您甚至可以像波纹管代码一样进行操作

function changeshit (result) {
    var $that = $(this);
    if (result == "success") {
            $that.closest('div')... // cool ha ?
};
$.ajax({
    url: 'http://'+document.domain+'/klanten/updateaddress.php',
    type: 'post',
    data: poststring,
    context: this,
    success: changeshit
});

2)你可以利用闭包(在这里阅读更多或搜索谷歌),所以你的代码会变成

var context = this;
$.ajax({
    url: 'http://'+document.domain+'/klanten/updateaddress.php',
    type: 'post',
    data: poststring,
    success: function(result) {   
        // here you can use any variable you declared before the call
        changeshit(result, context);
    }
});

作为旁注,我建议您使用变量/对象缓存,因此请在函数顶部声明var $this = $(this)并通过函数使用它,而不是每次需要时都调用$(this)