Javascript 如何更改链接单击时引导模式内的文本？

在我的网页上有各种文章的链接，可以在引导模式下打开文章。在Modal的主体中有两个链接，一个链接到上一篇文章，另一个链接到下一篇文章。到目前为止，当用户单击其中任何一个链接（显示模式中的内容）时，链接将加载到浏览器本身。下面是模态函数的样子：

 function openModal() {
  // Store vallues in variables: var url , urlSplit, mainPage, txt, content
  // prevLink, nextLink, imageURL etc.
  // All of them have correct values.

 $.ajax({
  type: "POST",
  url: 'getarticle.php',
  data: {
    link: url,
    page: mainPage
  },
  success: function(data) {
  var moreLinks =  '<a class="modal-link" href="'+nextLink+'">Next</a>';
  data = data+moreLinks;
  $('.feed-modal .modal-body').html(data);
  $('.progress').fadeOut();
}
});
}

---

因此，单击

moreLinks

应该会更改模式中的文本，但它会在浏览器中加载链接。如何在模式中加载内容？

由于链接是动态添加到DOM的，您需要使用事件委派：-

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

并将

event

添加到

openModal（）

，这样您就可以

event.preventDefault（）

要停止

a

在浏览器中加载时的默认行为：-

function openModal(event) {
   event.preventDefault() 

---

您需要在模式内的链接上设置一个

onclick

处理程序

//动态生成链接时的事件委派方法。
$（文档）。在（“单击”，“模态链接”，函数（e）{
e、 preventDefault（）；//在单击按钮时防止重定向
$（'.progress'）.fadeIn（）；//fadeIn进度
var url=this.href；
var mainPage=“”；//设置为某个值，我不知道它是什么。
$.ajax({
类型：“POST”，
url:'getarticle.php'，
数据：{
链接：url，
页面：主页
},
成功：功能（数据）{
//Rest所有更新内容的代码都是相同的。
var-moreLinks=''；
数据=数据+更多链接；
$（'.feed modal.modal body'）.html（数据）；
$（'.progress'）.fadeOut（）；
}
});
});链接仍在浏览器中加载。
function openModal(event) {
   event.preventDefault()