单击后更改链接名称和 href

Change links name and href after it's been clicked

我有以下 link:

<span class="hds-icon-star-empty" aria-hidden="true"><!-- --></span>  <a href="<?=$this->recordLink()->getActionUrl($this->driver, 'Save')?>" data-lightbox class="save-record" data-id="<?=$this->escapeHtmlAttr($this->driver->getUniqueId()) ?>"><?=$this->transEsc('Add to favorites')?></a><br/>
        <br/>

现在我想在单击 link 后将文本 "add to favorites" 更改为 "allready added to favorites"。 我想 onclick 函数不会工作,因为它会在 link 被点击之前重定向到新页面。

您可以使用 event.preventDefault()

停止 link 的默认行为

但您还必须使用 AJAX 向目标页面发送请求,以执行与数据库相关的实际功能。

document.querySelector("a").onclick = function(){
  event.preventDefault();
  this.innerHTML = "Already Added to Favorites";
  var href = this.getAttribute("href");
  //$.ajax({url : href ,...});
};
<a href = "/">Add to favorites</a>