网站上的所有页面链接均打开聊天窗口

Question

我有一个客户希望他的所有页面都链接到html主页中，即，当单击任何菜单，主页，所有内容时，打开聊天支持框。 Normal href应该像该示例一样执行此操作，但是主页上有几十个链接，他不想手动删除每个链接，而只想用一个代码来完成，这样他可以随时将其删除。

<a href="javascript:jivo_api.open();">Open the chat</a>

Answer 1

Normal href应该像这个示例

您显示的代码未使用正常的href。它使用了25年以上的技术，这是我们在拥有任何API标准或关注可访问性之前处理点击的方式。

首先，不要仅将超链接用作JavaScript事件挂钩。网页上的任何可见元素都支持click事件，但超链接表示导航。那些使用辅助技术的人，例如屏幕阅读器，在使用超链接而不是用于导航时，可能无法导航站点。相反，只需使用另一个内联元素（如span），然后指定click事件处理程序即可。

第二，不需要javascript:....，因为您将JavaScript与HTML分开（也称为“关注分离”）。

现在，您的问题。如果您只提供在单击通用CSS类时应打开聊天窗口的任何/所有元素，则可以创建非常简单的代码来查找所有元素，对其进行循环并为它们分配相同的事件处理程序，这将打开聊天。这是一个例子：

// Get all the elements that have the "chat" class and put into an array
let chatElements = Array.prototype.slice.call(document.querySelectorAll(".chat"));

// Loop over the array
chatElements.forEach(function(item){
  // Assign an event handler
  item.addEventListener("click", function(){
    console.log("open chat window here");
  });
});

.chat { cursor:pointer; color:blue; }

<p class="chat">I will open the chat</p>
<p>I won't open the chat</p>
<div>I will <span class="chat">open the chat</span></div>
<h1 class="chat">I will open the chat</h1>
<h5>I won't open the chat</h5>

Answer 2

$(function(){
     $('a').click(function(event) {
         jivo_api.open();
     });
});