Question

如何在几秒钟后使锚标签可点击？我将其设为不可点击，但现在无法再次点击。

（注意：标签不会使用id）

继承我的HTML和javascript：

function neww(id,time){
    var sec,min,hr;
    var i=(time*1);
    var neew=setInterval(function(){
        if(i>0){
            i--;
            if(i>=60){
                min=parseInt(i/60);
                sec=i%60;         
                if(min>=60){
                    hr=parseInt(min/60);
                    min=min%60;
                }else{
                    hr=0;
                }
            }else{
                min=0;
                hr=0;
                sec=i;
            }
            if(sec<10){
                sec="0"+sec;
            }
            if(min<10){
                min="0"+min;
            }
            if(hr<10){
                hr="0"+hr;
            }
            id.onclick=function(){return false}; // its working here
            id.style.color="red";
            id.style.backgroundColor="#ffffff";
            id.innerHTML=hr+':'+min+':'+sec;
        }
        if(i==0){
            id.innerHTML="Ready";
            id.style.color="#ffffff";
            id.style.backgroundColor="green";
            if(id.onclick==false){id.onclick=function(){return true};} // but its not working
            clearInterval(neew);
        }
    },1000);
}

HTML：

<a href="http://www.google.com/" target="_blank" class="mynewclass" onclick="neww(this,5);">Ready</a>

- 提前谢谢。

解决：

我刚刚删除了＆＃39; onclick＆＃39;来自锚点的属性，因此在计时器完成之前，计时器功能不会成为障碍。感谢大家的努力，这帮助我解决了这个问题。

链接有效，但不会干扰定时器功能：

function neww(id,time){
    var link=id.getAttribute("onclick");
    id.removeAttribute("onclick");
    var sec,min,hr;
    var i=(time*1);
    var neew=setInterval(function(){
        if(i>0){
            i--;
            if(i>=60){
                min=parseInt(i/60);
                sec=i%60;         
                if(min>=60){
                    hr=parseInt(min/60);
                    min=min%60;
                }else{
                    hr=0;
                }
            }else{
                min=0;
                hr=0;
                sec=i;
            }
            if(sec<10){
                sec="0"+sec;
            }
            if(min<10){
                min="0"+min;
            }
            if(hr<10){
                hr="0"+hr;
            }
            id.style.color="red";
            id.style.backgroundColor="#ffffff";
            id.innerHTML=hr+':'+min+':'+sec;
        }
        if(i==0){
            id.innerHTML="Ready";
            id.style.color="#ffffff";
            id.style.backgroundColor="green";
            id.setAttribute("onclick",link);
            clearInterval(neew);
        }
    },1000);
}

当计时器运行时，链接的这个已经死了：

function neww(id,time){
    var link=id.getAttribute("onclick");
    var linkk=id.getAttribute("href");    
    var sec,min,hr;
    var i=(time*1);//+60;
    var neew=setInterval(function(){
        if(i>0){
            i--;
            if(i>=60){
                min=parseInt(i/60);
                sec=i%60;         
                if(min>=60){
                    hr=parseInt(min/60);
                    min=min%60;
                }else{
                    hr=0;
                }
            }else{
                min=0;
                hr=0;
                sec=i;
            }
            if(sec<10){
                sec="0"+sec;
            }
            if(min<10){
                min="0"+min;
            }
            if(hr<10){
                hr="0"+hr;
            }
            id.removeAttribute("onclick");
            id.removeAttribute("href");
            id.style.color="red";
            id.style.backgroundColor="#ffffff";
            id.innerHTML=hr+':'+min+':'+sec;
        }
        if(i==0){
            id.innerHTML="Ready";
            id.style.color="#ffffff";
            id.style.backgroundColor="green";
            id.setAttribute("onclick",link);
            id.setAttribute("href",linkk);
            clearInterval(neew);
        }
    },1000);
}

Answer 1

我在这里给你一个想法。请根据您的需要进行修改。希望它有所帮助。

三分钟后，它将创建链接。

<强> HTML：

<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <a href="http://www.google.com/" target="_blank" class="mynewclass">Ready</a>
</body>
</html>

<强> jQuery的：

$(function(){
  var link = $('.mynewclass').attr('href');
  $('.mynewclass').removeAttr('href');

  setTimeout(function(){
    $('.mynewclass').attr('href', link);
  }, 3000);
});

<强>使用Javascript：我使用的是javascript getElementsByClassName 方法。如果您使用的是较旧的浏览器，那么我认为它不起作用。请检查浏览器支持。

window.onload = function () {
        var elem = document.getElementsByClassName('mynewclass'),
            urlLink = elem[0].getAttribute('href'),
            emptyURL = elem[0].removeAttribute('href');

    setTimeout(function () {
        urlLink = elem[0].setAttribute('href', urlLink);
    }, 3000);
}

这是jsbin链接 - http://jsbin.com/dawit/2/

Answer 2

在Vanilla JavaScript中：

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <title>Delay Click</title>
</head>

<body>
    <a href="http://www.google.com/" target="_blank" class="mynewclass">Ready</a> |
    <a href="http://www.google.com/" target="_blank" class="mynewclass">Ready</a> |
    <a href="http://www.google.com/" target="_blank" class="mynewclass">Ready</a> |

<script>
    var enableLinks = false;

    setTimeout(function(){
        enableLinks = true;
    }, 5000); //add delay of 5 seconds = 5000 miliseconds

    function clickHandler(e){
        var el = e.target;
        if(!enableLinks){
            e.preventDefault();
        }else{
            //add rest of your logic here
            console.log("it's working");
        }   
    }

    var anchors = document.querySelectorAll(".mynewclass");
    for(var i=0; i< anchors.length; i++){
    if (anchors[i].addEventListener) {
      anchors[i].addEventListener('click', clickHandler, false); 
    } else if (anchors[i].attachEvent)  {
      anchors[i].attachEvent('onclick', clickHandler);
    }
}
</script>
</body>
</html>

使锚标记暂时不可点击，并使其再次可点击

2 个答案: