JS第二次点击打开一个href的函数？

Question

我正在寻找一个JS函数来使href仅在第二次点击时打开，而不是第一次点击。

这不是双击，而是第二次点击，我希望第二次点击在第一次点击后甚至几秒钟就可以工作。

有人知道我该怎么做？

非常感谢您的帮助！

朱

Answer 1

你可以做这样的：

const 
 
    clickedLinks = new Map(); 
 
    anchor = document.getElementById('linkA'); 
 
    
 
function onLinkClicked(event) { 
 
    if (!clickedLinks.has(event.target.id)) { 
 
    clickedLinks.set(event.target.id, true); 
 
    event.preventDefault(); 
 
    console.log(`Link to ${event.target.href} block, first time clicked.`); 
 
    return; 
 
    } 
 
    
 
    console.log(`Allow link ${event.target.href}`); 
 
} 
 
    
 
anchor.addEventListener('click', onLinkClicked); 
 

<a id="linkA" href="stackoverflow.com" target="_blank">Stack Overflow</a>

这是一个有点多了一个简单的用例与单个链接，但这个效果很好，即使你有很多链接，你想有相同的行为。

你还可以：

• 设置一个布尔值，并检查它是否已经设置
• 分配类的链接，并只允许当类已设置的点击浏览。
• 在元素上设置一个数据属性，并检查它是否有值或设置或删除。

有可能有更多的方法来实现你想要的行为。

Answer 2

<a href = javascript:{window.clickCount?location.href='https://www.google.com':window.clickCount=1}>hahahahahaha</a> 

只是固定的https://www.google.com你的链接

Answer 3

$(document).ready(function() 
 
{ 
 
    $('.second-click').on(
 
    'click', 
 
    function(e) 
 
    { 
 
     e.preventDefault(); 
 
     var self = $(this); 
 
     if($(this).data('clicked') == 1) { 
 
     clickLink(self); 
 
     self.data('clicked', false); 
 
     } 
 
     else { 
 
     $(this).data('clicked', 1); 
 
     setTimeout(function(){ 
 
      self.data('clicked', false); 
 
     }, 10000); 
 
     } 
 
    } 
 
); 
 
    
 
    function clickLink($link){ 
 
    console.log('link was clicked'); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="#" class="second-click">Click me!</a>

所以在这里我们检查链接是否被检查一次。如果是这样，进一步处理。在10秒内，需要再次检查两次。希望这有助于

Answer 4

document.getElementById('a').onclick = function() { 
 

 
    if (this.clickedBefore) { 
 
    a.setAttribute('href', 'http://www.google.com'); 
 
    a.setAttribute('_target', '_blank'); 
 
    this.clickedBefore = !this.clickedBefore; 
 
    } else { 
 
    this.clickedBefore = true; 
 
    } 
 
}

<a href="#" id="a">My Link</a>

Answer 5

$(function(){ 
 
    var $clickLinks = $('.social').find('ul').children('li'); 
 
    \t $($clickLinks).find('a').attr('onClick','return false'); 
 
    \t $($clickLinks).on('click', 'a', function(events){ 
 
    \t \t var nearBy = $(this).closest('li'); 
 
    \t \t 
 
    \t \t $($clickLinks).each(function(index, element) { 
 
       $(this).removeClass('selected'); 
 
    \t   $(this).find('a').attr('onClick','return false'); 
 
      }); 
 
    \t \t 
 
    \t \t nearBy.addClass('selected'); 
 
    \t \t if(nearBy.hasClass('selected')) 
 
    \t \t { 
 
    \t \t \t $(this).attr('onClick',"return true"); 
 
    \t \t \t 
 
    \t \t } 
 
    \t \t else { 
 
    \t \t \t $(this).attr('onClick','return false'); 
 
    \t \t \t 
 
    \t \t } 
 
    \t }); 
 
    
 
    });

<ul> 
 
    \t <li><a href="abc.html" target="_blank" >one</a></li> 
 
     <li><a href="abc.html" target="_blank" >two</a></li> 
 
     <li><a href="abc.html" target="_blank">three</a></li> 
 
    </ul>

希望这是你正在寻找:)

Answer 6

感谢所有帮助答案。

我没有身份证供我的HREF，但一个类。

这里是我的href：

<a class="ult-new-ib-link" href="http://matieresetcouleurs.ch/parution-elle-decoration/" title="En savoir plus"></a> 

我试图通过改变ID到类名的第一个解决方案，但它不工作。 这里是我的尝试：

const 
    clickedLinks = new Map(); 
    anchor = document.getElementByClassName('ult-new-ib-link'); 

function onLinkClicked(event) { 
    if (!clickedLinks.has(event.target.ClassName)) { 
    clickedLinks.set(event.target.ClassName, true); 
    event.preventDefault(); 
    console.log(`Link to ${event.target.href} block, first time clicked.`); 
    return; 
    } 

    console.log(`Allow link ${event.target.href}`); 
} 

anchor.addEventListener('click', onLinkClicked); 

我想设置此功能severals HREF因此，包括直接在功能href是不是为我工作的解决方案。

顺便说一句，我在wordpress上这样做，所以我不喜欢通过添加li或脚本来更改HTML。

我使用插件在模板中添加JS函数。