Question

当用户点击索引页面上的删除按钮时。弹出模式，第一个函数将URL路径传递给模态中删除按钮的taskdestroylink属性。到现在为止一切正常。每次我点击链接时，属性都会正确设置。

第二个功能是将AJAX请求发送到服务器。在页面重新加载第一个请求工作正常，但第二个请求保持第一个请求。因此var href首次正确设置，但如果我尝试删除其他任务，则href值仍属于第一个任务。这很奇怪，因为我提到taskdestroylink属性显示了DOM中的新值。

那么var href = $(this).data("taskdestroylink");有什么问题？为什么不设置新值？

单击此链接打开模态get：

<li>
  <a href="#" data-toggle="modal" role="button" data-target="#delete-task-modal" class="open-delete-task-modal" data-taskdeletelink="<%= user_task_path(current_user, task) %>">Delete Task</a>
</li>

模态：

<div class="modal-footer">
  <button type="button" class="btn btn-default" data-dismiss="modal" id="deletetaskclose">Close</button>
  <a href="#" id="delete-task-link" type="button" class="btn btn-danger" data-taskdestroylink >Delete Task</a> 
</div>

JS：

$(document).on('click', '.open-delete-task-modal', function (event) {
  var taskDeleteLink = $(this).data("taskdeletelink");
  $('#delete-task-link').attr("data-taskdestroylink", taskDeleteLink);
});

$(document).on('click', '#delete-task-link', function (event) {
  var href = $(this).data("taskdestroylink");
  alert(href);
  $.ajax({
    type: "DELETE",
    url: href,
    dataType: "script"
  });
});

Answer 1

混合data()和attr()是一个坏主意，所以选择一个并坚持下去。

更改

.attr("data-taskdestroylink", taskDeleteLink);

到

.data("taskdestroylink", taskDeleteLink);

data()使用自己的内部存储而不是实际属性。

变量未正确设置

1 个答案: