防止模态窗口中的单击链接加载已单击的链接。

Question

我有一个链接列表，点击后应该打开一个带有一些信息的模态窗口。我使用e.preventDefault();来防止浏览器的默认操作，然后添加自己的自定义代码来加载模态窗口中的数据。内容加载得很好，但几秒钟后，我点击的链接所在的整个网站都会加载到模态窗口中。

1. 这只发生在特定网站的链接上。
2. 这个问题应该首先解决该网站的链接。先点击其他链接可以解决此问题。

这是我的代码:

$('a.modal-link').on('click', openModal);

function openModal(evt) {
  evt.preventDefault();
  var link = $(this).attr("href");
  var text = $(this).text();
  safeModal(link, text);
};

function safeModal(linkUrl, linkText) {
  var link = linkUrl;
  var page = window.location.href.split('?')[0];
  var text = linkText;
  var ajaxURL = "http://example.com/script.php";

  $.ajax({
    type: "POST"
    , url: ajaxURL
    , data: {
        link: link
        , page: page
    }
    , success: function (markup) {
        $(".feed-modal .modal-body").html(markup);
    }
  })
};

我可以提供实际网站的链接，以便您自己查看问题（我可能没有正确解释）。 更新：我正在添加链接。尝试单击第一个标题，您会看到问题。之后，重新加载网页，然后单击第六个链接。现在，关闭模态框，再次单击第一个链接。这次应该完美地工作。更新：语法错误不存在。这是我的错误。 :)

- Neena Vivek

---

首先，尝试消除JS错误。未捕获的引用错误：swfobject未定义。它可能会阻止您的脚本传播。 - Rafał Łyczkowski

@RafałŁyczkowski 这个错误是由于其他域名导致的，与我的代码无关。 - Neena Vivek

Answer 1

这段代码有语法错误（删除})）：

success: function (markup) {
  $(".feed-modal .modal-body").html(markup);
  }) //delete this
}

整个函数应该是：

function safeModal(linkUrl, linkText) {
  var link = linkUrl;
  var page = window.location.href.split('?')[0];
  var text = linkText;
  var ajaxURL = "http://example.com/script.php";

  $.ajax({
    type: "POST"
    , url: ajaxURL
    , data: {
        link: link
        , page: page
    }
    , success: function (markup) {
        $(".feed-modal .modal-body").html(markup);
        //}) without this
    }
  })
};

正在工作演示

- paolobasso