將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> 

彈出功能代碼創建了它自己的按鈕，但我不希望這樣。 我需要將其鏈接到“超鏈接”標記，而無需更改鏈接的樣式。 因此，我需要的功能不是創建它自己的按鈕，而是要執行實際的動作，即一旦單擊鏈接，便會彈出所需的彈出窗口。

有任何想法嗎？

Answer 1

並不是真正的解決方案，而是一種快速而骯臟的解決方法，將隱藏創建的按鈕並觸發您的按鈕單擊以單擊彈出按鈕。

我不建議這樣做，但是加載的腳本很難理解（對我而言）。

這樣的事情應該起作用：

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

 .createsend-button { display: none; } 

我建議給您的按鈕一個ID

Answer 2

只需適當地更改您的鏈接/按鈕即可。 您可以刪除該js函數。 您不必使用它。

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

至

<a href="javascript:void(0)" class="button_promo" onclick="window.open("http://www.somelink.com", "_blank", "location=1,status=1,scrollbars=1, width=400,height=400")">Sign up</a>