Question

在JSP中，我有许多类似的div（我不知道有多少，它们是基于某些数据库值生成的），包含event1，event2等ID。

让我们考虑id为event1的div。在这个div中，有一个id为foll1的按钮。单击此按钮，我想向名为“Follow”的servlet发送一个AJAX请求，该servlet将切换按钮中的文本（文本可以是“Follow”或“Unfollow”）。 AJAX请求应该发送id = name1的属性值。

Answer 1

试试这个，下面的代码是为了基本的理解，您可能需要根据需要进行更改，基本上当用户单击它时将检查按钮的文本并将调用带有true或false的ajax（follow / unfollow），在获得成功响应时，它将切换文本。

$("button").click(function(){

    var Invoker = this;

    if($(this.val() == "Unfollow"))
    {
        $.post("{Your Url}", { "follow" : false }, function(flag){
            if(flag == true) $(Invoker).val("Follow");
        });
    }
    else
    {
        $.post("{Your Url}", { "follow" : true }, function(flag){
            if(flag == true) $(Invoker).val("Unfollow");
        });
    }
});

Answer 2

HTML：

<button class="js-addName" type="button" data-id="name1">Follow</button>

的jQuery

$('button.js-addName').click(function(){
    // set your vars
    var theButton = $(this),
    theName = theButton.data('id');

    // ajax, and then use the promise
    $.post( "yourfile.jsp", { id: theName } ).done(function() { 
      $theButton.text($theButton.text() === "Follow" ? "Unfollow" : "Follow");
    });
}

jQuery AJAX用于许多生成的div

2 个答案: