使用<a href>链接和</a> <onclick> <a href>一起发挥作用</a>

Question

如何使它成为使用href和onClick函数的标签？ （应先运行onClick，然后再运行href）

版本1

<a href="#" id="myHref">Click me</a>

$("#myHref").on('click', function() {
    document.getElementById(".myDiv").style.flexGrow = "5";
     window.location = "http://www.google.com";

});

版本2

 <a href="http://www.google.com" onclick="return myFunction();">Link</a>

function myFunction() {
    document.getElementById(".myDiv").style.flexGrow = "5"; 
}

Answer 1

您需要取消点击，调用动画，然后添加延迟以跟随链接。

$("#myHref").on('click', function(evt) {
    evt.preventDefault(); //cancel the default click action
    document.getElementById(".myDiv").style.flexGrow = "5";
    var url = this.href;  //get the href of the clicked link
    window.setTimeout( function () {  //delay setting the location
        window.location.href = url;
    }, 5000); //number of milliseconds to wait
});

setTimeout将允许动画发生。 调整时间以适应所有问题。

Answer 2

href不是事件，所以我不确定您的意思。

您的onclick首先运行，但是如果您不希望激活href，则应该return false 。

版本1

$("#myHref").on('click', function() {
    document.getElementById(".myDiv").style.flexGrow = "5";
    window.location = "http://www.google.com";
    return false;
});

此外， document.getElementById(".myDiv")的名称中不应包含点。 （假设您要获取<div id="myDiv"> 。如果您使用jQuery，则只需使用$("#myDiv") 。

Answer 3

您可以使用版本1，只需将`event.preventDefault（）'添加到处理程序中：

<a href="http://www.google.com" id="myHref">Click me</a>

$("#myHref").on('click', function(event) {
     event.preventDefault();
     document.getElementById(".myDiv").style.flexGrow = "5";
     window.location = event.currentTarget.href;
});