Question

我需要在元素上动态分配一个id以发出POST请求，然后将一个类添加到另一个元素。我真的是JS的菜鸟，所以我觉得我搞得一团糟......

基本上，我有一个带有forEach循环的jsp页面，用于创建行。在最后，我有一个单击的链接发送POST请求。有了请求的结果（布尔T / F），我需要在元素上应用一个类。

问题是如何创建动态id以传递给脚本，以及如何根据POST结果选择添加类。

我的jsp有这个forEach循环

<c:forEach items="${notifications }" var="notification">
    <tr id="${notification.notificationId }">
        <td class="actions pull-right"><a href="#"> <i class="fa fa-gear"></i></a></td>
    </tr>
</c:forEach>

脚本是

$(document).ready(function(){
    $("#${notification.notificationId").closest('a').click(function(){  
            $.ajax({
                type: 'POST',
                url: '/${notification.notificationId}',
                dataType: 'text',
                success: function (text) {
                    $("#${notification.notificationId"}).addClass("font-bold");
                    alert(text);
                })
        })
    })

显然它不起作用，因为$("#${notification.notificationId"})它不正确（我不知道脚本的其余部分是否也能正常工作......

Answer 1

首先，您需要获取点击链接行容器。您选择被单击的元素并获取它的父级，直到您使用正确的容器。以上是你可能要做的一个例子。

$(document).ready(function () {

    $("tr > td > a").on("click", function (e) {
      // This will prevent your link to navigate to "#"
      e.preventDefault();

      // This is the container row of the link that was clicked
      var $tr = $(this).parent().parent();

      // The ajax request
      $.ajax({
        type: "post",
        url: "/" + $tr.attr("id"), // This will take the ID of the row container. Eg: ID=1 it will navigate to "/1"
        dataType: "text",
        success: function (response) {
          // I presume that you response will be either "true" or "false" like you mention
          // So, if the response is "true", then we add the class to the row container
          if (response == "true") {
            $tr.addClass("font-bold");
          }

        });

      });

    });

});

祝你好运！

Ajax - 动态创建帖子请求按钮

1 个答案: