单击指向超链接的按钮时，如何避免原始页面转到不同的页面？

Posted 2023-03-25

【中文标题】单击指向超链接的按钮时，如何避免原始页面转到不同的页面？

【英文标题】：How to avoid having original page going to a different page when clicking on button leading to hyperlink?

【发布时间】：2021-07-29 06:06:53

【问题描述】：

注意：我希望我的链接在新标签页中打开，但将其保留在原标签页所在的位置。然而，原来的标签会导致不同的地方？

        .btn 
            background-color: transparent;
            border-radius: 28px;
            border: 1px solid #0762C8;
            display: inline-block;
            cursor: pointer;
            color: #0762C8;
            font-family: Tahoma;
            font-size: 14px;
            padding: 4px 13px;
            text-decoration: none;
            position: absolute;
            margin-top: -10%;
        
    
        .btn:hover 
            background-color: #0762C8;
            border-color: #0762C8;
        
    
        .btn:active 
            position: relative;
            top: 1px;
        
    
        .flex-container 
            display: flex;
            justify-content: center;
        

    <div class="col-12 col-md-6 col-lg-4 py-3 text-center border"><a
                        href="http://www.example.net/" target="_blank"
                        ><img class="img-fluid" font-family:lucida="" sans=""
                            src="/images/contentimages/images/Giveaways.png" /></a>
    
                    <p class="my-3" style="font-size:18px;">&nbsp;</p>
    
                    <div class="flex-container"><a class="btn btn-info btn-sm edatalayer order-1" onclick=" window.open('http://www.example.net/','_blank')"
                            data-list="product-listing-page" data-position="1" data-purl="custom-business-forms"
                            >Giveaways <i class="far fa-chevron-right pl-1"></i></a></div>
                </div>

【问题讨论】：

这能回答你的问题吗？ Open link in new tab or window

【参考方案1】：

您需要考虑使用 target="_self"。请参阅https://www.w3schools.com/tags/att_a_target.asp 了解更多信息。

【参考方案2】：

您可以在javascript中使用window.open函数，而不是直接添加链接：

<a href="javascript:window.open('https://example.com')">
<img class="img-fluid" font-family:lucida="" sans="" src="/images/contentimages/images/Giveaways.png" />
</a>

【参考方案3】：

您可以使用onclick：

<a href="https://example.com" onclick="window.open('#','_blank');window.open(this.href,'_self');">

【讨论】：

这可行，但是它会在新标签中打开原始标签。有没有办法将原始页面保留在原始标签中，然后在新标签中打开链接？