javascript - 定位特定元素 jquery

Question

我在网上搜索了这个，但找不到解决方案，只是我想用ajax响应替换button元素内的内容。我面临的唯一问题是，整个 div 都在改变，而不是我点击的那个。如果我将类更改为 id，则仅第一个更改而不是我想要的特定按钮。那么如何替换特定按钮的内容呢？

PHP 代码:

while($row = $result->fetch_assoc()){// there are four rows so I have 4 buttons.
echo "<button class=btn btn-primary test' value='."$row['id']".'>."$row['voteup']".</button>"; 
 }

JavaScript 代码:

$(function() {
 $('.test').on('click', function() { // attach the click to the button
var test_val = $(this).val(); // Grab the value from the button
$.ajax({
    type: "GET",
    url: "test.php", // Move ?tar=vrate to the data array.
    data: {tar: 'vrate', test: test_val},
    cache: false,
    success: function(response)
    {  
        $(".test").fadeIn('slow').html(response);//this is replacing all 4 buttons not just one, if I change the class to id, only the first one is being replaced with the response. I also tried $( .test", this) but no luck.

    }
});
 });
});

Answer 1

$(function () {
    $('.test').on('click', function () {
        var test_val = $(this).val();
        $.ajax({
            // -------v Set the context of the callback
            context: this,
            type: "GET",
            url: "test.php",
            data: {
                tar: 'vrate',
                test: test_val
            },
            cache: false,
            success: function (response) {
                // v--and use `this` here
                $(this).fadeIn('slow').html(response);
            }
        });
    });
});