单击超链接时调用 javascript 函数

IT技术 javascript hyperlink
2021-03-08 13:54:50

我正在 ASP.NET 的 c# 代码隐藏文件中动态创建超链接。我需要在客户端单击时调用 JavaScript 函数。我如何做到这一点?

6个回答

更整洁,而不是typical href="#"orhref="javascript:void"href="whatever",我认为这更有意义:

var el = document.getElementById('foo');
el.onclick = showFoo;


function showFoo() {
  alert('I am foo!');
  return false;
}

<a href="no-javascript.html" title="Get some foo!" id="foo">Show me some foo</a>

如果 Javascript 失败,会有一些反馈。此外,还消除了不稳定行为(在 情况下跳转页面,在 情况下href="#"访问同一页面href="")。

@Lewis,是的,理想情况下 <a> 标签不会用于纯 js 调用,但不幸的是,旧浏览器不支持 :hover 非链接元素。所以链接经常被用来触发js事件。
2021-04-21 13:54:50
+1 这是目前唯一不引人注目的答案。如果可以的话,+100。
2021-04-22 13:54:50
这不起作用,它只是将您定向到 href 网址。
2021-05-11 13:54:50
对我不起作用,只是在页面加载时自动执行 onclick 功能。在可访问性方面,这似乎也是一场噩梦。
2021-05-14 13:54:50
@Chris - 我不确定你明白我的意思,克里斯。我建议您不要使用<a href="#">什么都不做</a>,而是使用<a href="a/link/somwhere.html">做某事</a>,然后使用渐进增强以覆盖 href。这是最干净的解决方案。锚点很好,但如果 javascript 被禁用,它们应该做一些事情 - 或者由于某种原因(根据 IE6)在创建和分配处理程序之前某些 javascript 损坏。这样,您的所有用户都会感到高兴。
2021-05-16 13:54:50

最简单的答案是......

<a href="javascript:alert('You clicked!')">My link</a>

或者回答调用javascript函数的问题:

<script type="text/javascript">
function myFunction(myMessage) {
    alert(myMessage);
}
</script>

<a href="javascript:myFunction('You clicked!')">My link</a>

是的,这很奇怪,它对我有用,现在不是。其他人也遇到了类似的问题,除了完全重新安装 Firefox 之外,似乎没有一个明确的解决方案。
2021-04-24 13:54:50
StackOverflow“运行代码片段”中的链接在 Firefox 中不起作用(未创建警报),但是当我将这种类型的链接放在普通网页上时,它在 FF 中起作用。
2021-05-09 13:54:50

使用 onclick 参数...

<a href='http://www.google.com' onclick='myJavaScriptFunction();'>mylink</a>
令人困惑的陈述。是访问 google.com 还是调用 javascript 函数?哪个优先?
2021-05-15 13:54:50
onclick优先于href. 这就是为什么这有效。
2021-05-16 13:54:50

JQuery 的答案。由于 JavaScript 是为了开发 JQuery 而发明的,因此我在 JQuery 中为您提供了一个示例:

<div class="menu">
    <a href="http://example.org">Example</a>
    <a href="http://foobar.com">Foobar.com</a>
</div>

<script>
jQuery( 'div.menu a' )
    .click(function() {
        do_the_click( this.href );
        return false;
    });

// play the funky music white boy
function do_the_click( url )
{
    alert( url );
}
</script>
JavaScript 是为了开发 jQuery 而发明的?那是新的!
2021-04-30 13:54:50
这就像读到乐高是为了建造乐高蝙蝠侠而发明的。
2021-05-09 13:54:50
@ShawnSolomon 我很高兴我们同意:)
2021-05-14 13:54:50
@elcuco,好讽刺!+'d :) JQuery 万岁
2021-05-21 13:54:50

我更喜欢使用 onclick 方法而不是 javascript 超链接的 href 。并且始终使用警报来确定您拥有什么value。

<a href='#' onclick='jsFunction();alert('it works!');'>Link</a>

它也可以用于输入标签,例如。

<input type='button' value='Submit' onclick='jsFunction();alert('it works!');'>