在jquery中访问嵌套函数中的外部函数元素

时间:2014-06-11 16:41:00

标签: javascript jquery

我有一个具有更改功能和ajax的函数。

$( ".spring_explorations" ).each(function() {
        $("#" + this.id + " select").change(function() {
            alert("t");
            $.ajax({
                type: 'POST',
                url: ('/admin/applications/get_sections_for_modal'), //pass query string to server
                data: {
                exploration_id: $("#" + this.id + " select").val()
                },
                success: function (response) {
                    $(this).parents('span').next().show();
                    $(this).parents('span').next().find("select").html(response);
                    console.log(response);
                },
                error: function (xhr, ajaxOptions, thrownError) {
                    console.log(thrownError);
                }
            })
        });
    });

我想在$(this)脚本的spring_explorations代码段中访问success类的ajax元素。

我可以通过添加change来访问context: this函数的元素,但是如何获取外部元素呢?

先谢谢。

编辑:

$(this).parents('span').next().show();等未定义,因为this可能是ajax本身而不是spring_explorations类。

如果这是一个重复的问题,我很抱歉。我只是相当新的javascript,我认为这是问这个事情的正确的地方。如果您认为这不合适,请关闭我的问题。

3 个答案:

答案 0 :(得分:4)

只需将this存储在变量中即可。它往往被命名为thatme或其他类型的同义词来表示这一点。

$( ".spring_explorations" ).each(function() {
    var that = this;
       //^ store this into variable
    $("#" + this.id + " select").change(function() {
        alert("t");
        $.ajax({
            type: 'POST',
            url: ('/admin/applications/get_sections_for_modal'), //pass query string to server
            data: {
            exploration_id: $("#" + this.id + " select").val()
            },
            success: function (response) {
                $(that).parents('span').next().show();
                //^ re-use stored `this` value
                $(that).parents('span').next().find("select").html(response);
                console.log(response);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                console.log(thrownError);
            }
        })
    });
});

答案 1 :(得分:0)

您需要从要使用它的上下文中引用this。您可以使用嵌套作用域中的引用,其中this的值将根据作用域而改变,因为您有发现了。

$( ".spring_explorations" ).each(function() {
    var _this = this;
    // You now have a reference to the node in the variable _this
    // that can be used anywhere within this functions scope

    $("#" + this.id + " select").change(function() {
        var self = this;
        // Self is now a reference to the changed element
        // that can be used within this functions scope

        // your code here that uses _this and self when you please.
    });
});

答案 2 :(得分:0)

你为什么要在每一篇文章中写作,你应该这样写,如果这些元素在你的评论中是动态的那样:

    $(".spring_exploration").on('change','select',function() {
         var element = this;
        alert("t");
        $.ajax({
            type: 'POST',
            url: ('/admin/applications/get_sections_for_modal'), //pass query string to server
            data: {
            exploration_id: $(element).val()
            },
            success: function (response) {
                $(element).parents('span').next().show();
                $(element).parents('span').next().find("select").html(response);
                $(element).closest(".spring_exploration") // you can access like this
                console.log(response);
            },
            error: function (xhr, ajaxOptions, thrownError) {
                console.log(thrownError);
            }
        })
    });

现在您可以使用closest

访问它了