2

我有多个div带有垃圾桶图标的标签。
每个都div指一个唯一的名称，但垃圾桶图标对所有div标签的功能相同。
当垃圾桶图标是clicked一个模态显示（使用foundation.zurb）。
模态是 aform有两个input值：OK和Cancel。

当OK按钮是clicked我想要form触发模式显示submit的标签的唯一名称时。div这就是我所拥有的：

$('a#delete-book').on('click', function(event) {
    console.log('clicked delete');
    event.preventDefault();

    var school, book, genre, url;

    var self = $(this);
    school = $("#school-name").text();
    book = self.parent().children('h3').text();
    genre = self.parent().children('span').text();
    url = '/' + school + '/' + book + '-' + genre;
    console.log('url:\n', url);

    //REVEAL MODAL
    $('#deleteModal.reveal-link').trigger('click');

    doesThisWork(self, url);
  });//DELETE END

  function doesThisWork(self, url) {
    console.log(self, url);

    //EVENT LISTENER ON YES
    $('form#delete-book-form').on('click', function(mevent) {
      console.log('delete-book confirmed');
      $.ajax({
        url: url,
        type: "DELETE",
        dataType: "json"
      })
      .done(function() {
          console.log('delete successful');
          self.parent().remove();
      })
      .fail(function(err) {
        console.log('error:\n', err);
        alert('error:\n', err);
      })
    });//DELETE CONFIRM END
  }

我不知道为什么当我删除另一本书时再次提交之前的 ajax 请求。
我错过了event.preventDefault()某个地方吗？

有什么建议么？

4

1 回答 1

2

我的第一个想法是您将事件多次绑定到form#delete-book-form元素（每次单击a#delete-book元素）：

$('form#delete-book-form').on('click', function(mevent)

因此，每次执行此操作时，都会将一个新的处理程序附加到单击事件。您可以尝试在 .on-statement 之前取消绑定事件，以删除先前的绑定：

$('form#delete-book-form')。关闭（“点击”）；

于 2013-10-07T22:45:18.430 回答