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);
            }
        });
    });
});

Answer 2

尝试在此处使用$(this)引用来实现您的目标，

$('.test').on('click', function() { // attach the click to the button
   var test_val = $(this).val(); // Grab the value from the button
   var $this = $(this);
     $.ajax({
       type: "GET",
       url: "test.php", // Move ?tar=vrate to the data array.
       data: {tar: 'vrate', test: test_val},
       cache: false,
       success: function(response)
         {  
           $this.fadeIn('slow').html(response);
         }
     });
 });

定位特定元素jquery

2 个答案: