javascript - ajaxが前のリクエストを繰り返さないようにする方法は?

Question

divゴミ箱アイコンのタグが複数あります。
それぞれdivが一意の名前を参照しますが、ゴミ箱アイコンはすべてのdivタグで同じように機能します。
ゴミ箱アイコンがclickedモーダル リビールの場合 (foundation.zurb を使用)。
モーダルはformと の 2 つのinput値OKを持つCancelです。

OKボタンがの場合、モーダルを表示するトリガーとなったタグの一意の名前がclicked必要ですform。これは私が持っているものです:submitdiv

$('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()

助言がありますか？