小编S. *_*nes的帖子

我已将内联脚本移至外部页面以符合内容安全策略。这是我需要解决的最后一个 CSP 问题。我需要帮助用事件侦听器替换两个按钮中的“onclick”。我已经进行了彻底的研究，但这些示例与我的代码有很大不同，我很难弄清楚。我对 JavaScript 很陌生。我有两个切换选项卡，单击时会显示定价。页面加载时，第一个选项卡默认打开。当我从按钮中删除“onclick”并将事件侦听器添加到我的 JS 文件中时，单击时选项卡将不再打开，并且默认打开也不起作用。我确信这很简单，但我希望能够帮助您在外部页面中格式化 Javascript，以使这些切换选项卡能够与 CSP 配合使用。

这是我的html：

<div class="tab">
  <script type="text/javascript" src="/myExternalJavascript.js">
  </script>
  <button 
   class="tablinks"
   onclick="openTerms(event, 'Weekly')" 
   id="button1">Click This
  </button>
  <button 
   class="tablinks"
   onclick="openTerms(event, 'Monthly')" 
   id="button2">Click This
  </button>
</div>
<div id="Weekly" class="tabcontent">Do something great.</div>
<div id="Monthly" class="tabcontent">Do something great.</div>

这是我的外部 js 文件的内容（使用 w3 选项卡中的 javascript）：

// Get the element with id="button1" and click on it
document.getElementById("button1").click();

function openTerms(evt, priceTerms){
  // Declare all variables
  var i, tabcontent, tablinks;

  // Get all elements with class="tabcontent" and hide them
  tabcontent …