如何同时使用href和onclick ?

HTML/JQuery How can I use BOTH href and onclick?

本文关键字：onclick href 何同时      更新时间：2023-09-26

我被分配到一个有一堆按钮的网页上工作。每个按钮都需要向下滚动到特定的div并更改其内容。我的问题是，每次我点击，它只锚，从来没有激活onclick，除非我删除href。我怎样才能使它同时使用href和onclick?

的例子:

<a href="#divId" onclick="alert('Test');"><img src="images/image.png" /></a>

如果你从onclick返回true，它将执行href。如果你从onclick返回false，它将不会执行href:

<a href="#divId" onclick="alert('Do nothing'); return false;">Do Nothing</a>
<a href="#divId" onclick="alert('Do something'); return true;">Do Href</a>

一种方法是在javascript中跳转到位置。这样做的好处是你可以选择它发生的顺序。在本例中，如果您愿意，可以在移动到新位置后显示警告。

你可以这样写一个函数:

function jumpTo(strLocTag){
    window.location.hash = strLocTag;
}
然后像这样修改HTML: 
<a href="#" onclick="jumpTo('divId');alert('Test');"><img src="images/image.png" /></a>

试着用onclick调用一个函数，所以当你点击它的时候它会做你想做的然后重定向到你所指向的url 

window.location.replace("~/Page.aspx#divId");

你也可以使用一个函数来保持你的HTML整洁

<a href="#divId" onclick="extra(); return false;"><img src="images/image.png" /></a>

在javascript文件

function extra(){
    alert("Test");
    window.location.replace("http://stackoverflow.com");
}

如果是我，我会在onClick方法中做所有的事情，忘记href部分。

onClick方法可以做你首先想做的事情，然后向下滚动到锚标记。下面是我用jQuery编写的一个函数，它使用锚标记平滑地滚动页面上的某个地方。我将这样使用它:

function smoothScroll(anchorName, scrollSpeed) {
    // Do whatever you were going to have in the onClick event here
    // Start the scrolling to the anchor tag
    var gotoAnchor = "a[name='" + anchorName + "']";
    var scrollToPoint = $(gotoAnchor).offset().top;
    $('html, body').animate({ scrollTop: scrollToPoint }, scrollSpeed);
}

然后要使用该函数，只需取出链接的href并将该函数放入onClick事件中:

<a href="javascript:void(0)" onclick="smoothScroll('divId', 400);"><img src="images/image.png" /></a>
相关文章：