javascript - 将 javascript 弹出函数链接到超链接标记

Question

我是新来的，所以如果我的问题已经得到解答，请不要跳到我的喉咙；不过我一直在寻找答案。

好的，这就是我需要做的:在我忙碌的网站上，有一个外部 css 修改的超链接标签，看起来像一个按钮。单击后，它会将用户重定向到注册页面。hyprelink 元素的 html 和 css:

.button_promo {
  background: transparent none repeat scroll 0 0;
  border: 3px solid #ef4923;
  border-radius: 6px;
  color: #787878;
  cursor: pointer;
  display: inline-block;
  font-family: Vag, helvetica, arial;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 1px;
  line-height: 21px;
  outline: 0 none;
  padding: 7px 25px;
  position: relative;
  text-align: center;
  text-decoration: none;
  transition: background-color 0.2s ease-in-out 0s, color 0.2s ease-in-out 0s, border-color 0.2s ease-in-out 0s;
  width: 200px;
}

<ul>
  <li><a href="signup.html" class="button_promo">Sign up</a>
  </li>
</ul>

我需要做的是更改元素的功能，以便当用户单击它时，它会弹出一个弹出窗口。然而，这是我需要使用的弹出功能代码:

(function() {
  var e = document.createElement('script');
  e.type = 'text/javascript';
  e.async = true;
  e.src = ('https:' == document.location.protocol ? 'https' : 'http') +
    '://btn.createsend1.com/js/sb.min.js?v=3';
  e.className = 'createsend-script';
  var s = document.getElementsByTagName('script')[0];
  s.parentNode.insertBefore(e, s);
})
();

<div class="createsend-button" style="height:27px;display:inline-block;" data-listid="i/41/44A/73A/85038CAF46C6F93F">

</div>

弹出功能代码创建了它自己的按钮，但我不想要这样。我需要将其链接到超链接标记，而不更改链接的样式。因此，我需要的功能不是创建自己的按钮，而是在单击链接后执行实际的 Action ，即显示所需的弹出窗口。

有什么想法吗？

Answer 1

这并不是一个真正的解决方案，而是一个快速而肮脏的解决方法，即隐藏创建的按钮并触发单击按钮以单击弹出按钮。

我不建议这样做，但是加载的脚本(对我来说)很难理解。

类似的东西应该有效:

document.querySelector('.botton_promo').addEventListener("click", function() {
  document.querySelector('.createsend-button').click();
});

.createsend-button {
  display: none;
}

我建议给你的按钮一个 ID