Question

我认为我误解了jquery $(this)的工作方式。在我的代码中：

$(document).delegate(".ISBN_number", "change", 
        function()
        {
            var isbnNum = $(this).val();
            console.log("isbnNum = " + isbnNum);
            $.get("validate_isbn.php", {isbn: isbnNum},
                function(answer) 
                {                   
                    console.log("answer = " + answer);    //this does display the correct content
                    if (answer == true)
                    {   console.log("entered answer");
                        $(this).after("<img src='pics/green_checkmark.png' class='checkmark'>");
                    }
                    else 
                    {
                        $(this).after("nope");
                    }
            });             
    });

我正在尝试在更改内容时选择任何输入标记。当我在代码中调用$(this）时，我认为它会引用回这个输入标记，但它没有。我的问题是什么？是因为我使用了.delegate吗？（我需要使用它，因为输入标签是在以后动态生成的，它们在原始代码中不存在。）我该如何解决这个问题？

Answer 1

this（var isbnNum = $(this).val();）指的是.ISBN_number事件触发的change元素。 $(this)指的是包含在jQuery对象中的相同DOM元素，因此您可以在其上调用jQuery函数。

当您进行AJAX调用或使用匿名函数的任何其他类型的函数调用时，最好缓存原始this：

$(document).delegate(".ISBN_number", "change", 
        function()
        {
            var $this   = $(this),
                isbnNum = $this.val();
            console.log("isbnNum = " + isbnNum);
            $.get("validate_isbn.php", {isbn: isbnNum},
                function(answer) 
                {                   
                    console.log("answer = " + answer);    //this does display the correct content
                    if (answer == true)
                    {   console.log("entered answer");
                        $this.after("<img src='pics/green_checkmark.png' class='checkmark'>");
                    }
                    else 
                    {
                        $this.after("nope");
                    }
            });             
    });

这样你知道你总是指同一个this。

Answer 2

如果要从this调用访问.delegate()，则必须将其保存到本地变量中，因为this在ajax的完成函数中设置为不同的值呼叫。你可以这样做：

$(document).delegate(".ISBN_number", "change", 
        function()
        {
            var self = this;
            var isbnNum = $(this).val();
            console.log("isbnNum = " + isbnNum);
            $.get("validate_isbn.php", {isbn: isbnNum},
                function(answer) 
                {                   
                    console.log("answer = " + answer);    //this does display the correct content
                    if (answer == true)
                    {   console.log("entered answer");
                        $(self).after("<img src='pics/green_checkmark.png' class='checkmark'>");
                    }
                    else 
                    {
                        $(self).after("nope");
                    }
            });             
    });

Answer 3

$(this)指的是当前范围。在您的情况下，第一个$(this)引用.ISBN_number，而另一个$(this)引用的范围不同。

您应该缓存第一个$(this)，如此：

$(document).delegate(".ISBN_number", "change", 
    function()
    {
        $isbn = $(this);
        var isbnNum = $isbn.val();
        console.log("isbnNum = " + isbnNum);
        $.get("validate_isbn.php", {isbn: isbnNum},
            function(answer) 
            {                   
                console.log("answer = " + answer);    //this does display the correct content
                if (answer == true)
                {   console.log("entered answer");
                    $isbn.after("<img src='pics/green_checkmark.png' class='checkmark'>");
                }
                else 
                {
                    $isbn.after("nope");
                }
        });             
});

Answer 4

对于回调函数内的代码，

this可能会发生变化。但是，您应该能够通过使用缓存变量来解决这个问题：

$(document).delegate(".ISBN_number", "change", function () {
    var $this = $(this);
    var isbnNum = $this.val();
    console.log("isbnNum = " + isbnNum);
    $.get("validate_isbn.php", {
        isbn: isbnNum
    }, function (answer) {
        console.log("answer = " + answer); //this does display the correct content 
        if (answer == true) {
            console.log("entered answer");
            $this.after("<img src='pics/green_checkmark.png' class='checkmark'>");
        } else {
            $this.after("nope");
        }
    });
});

Answer 5

如果你有ISBN号的inputBox，＃（this）.val（）会给你在文本框中输入/更改的值。

不正确理解jquery $（this）

5 个答案: