访问事件以从源自标记的 onclick 属性的自定义函数调用 preventdefault

IT技术 javascript jquery html
2021-03-13 10:49:47

我有这样的链接:

<a href="#" onclick="myfunc({a:1, b:'hi'})" />click</a>
<a href="#" onclick="myfunc({a:3, b:'jo'})" />click</a>

我想做一个preventDefault()inside myfunc(),因为#点击链接时地址栏中会添加一个(不做return false;or href='javascript:void(0);'

这可能吗?我可以得到里面的事件吗myfunc()

6个回答

我相信您可以传入event内联函数,该函数将成为eventW3C 兼容浏览器中引发事件对象(即旧版本的 IE 仍需要在您的事件处理程序函数内部进行检测才能查看window.event)。

一个简单的例子

function sayHi(e) {
   e.preventDefault();
   alert("hi");
}
<a href="http://google.co.uk" onclick="sayHi(event);">Click to say Hi</a>

  1. 按原样运行它并注意该链接在警报后不会重定向到 Google。
  2. 然后,将event传递给onclick处理程序的内容更改为其他类似的内容e,单击运行,然后注意重定向确实发生在警报之后(结果窗格变为白色,表明重定向)。
@Omu 传入的参数 event 可以在任何地方,不必是第一个,只要它在函数定义的参数列表的正确位置即可。例如,function myfunc(o, e) {...},那么它可以被称为myfunc({a:1, b:'hi'}, event)
2021-04-23 10:49:47
好的,我明白我所要做的就是把我的参数放在第二位 myfunc(event, {a:123, b:"asdas"})
2021-05-04 10:49:47
我认为您不必显式传递和捕获事件对象。您可以简单地在函数中引用它。有人可以确认吗?我的意思是,没有事件的这段代码也应该有效:function sayHi() { event.preventDefault(); alert("hi"); }
2021-05-16 10:49:47

最简单的解决方案就是:

<a href="#" onclick="event.preventDefault(); myfunc({a:1, b:'hi'});" />click</a>

这实际上是一种对文档进行缓存破坏的好方法,并为没有启用 JS 的浏览器提供回退(如果没有 JS,则没有缓存破坏)

<a onclick="
if(event.preventDefault) event.preventDefault(); else event.returnValue = false;
window.location = 'http://www.domain.com/docs/thingy.pdf?cachebuster=' + 
Math.round(new Date().getTime() / 1000);" 
href="http://www.domain.com/docs/thingy.pdf">

如果启用了 JavaScript,它会打开带有缓存破坏查询字符串的 PDF,否则它只会打开 PDF。

如果您所追求的只是缓存破坏,则可以使用服务器端技术来重写该链接。
2021-04-18 10:49:47
会更好,但我无权访问服务器端代码。用我所拥有的来工作。
2021-05-04 10:49:47

试试这个:

<script>
    $("a").click(function(event) {
        event.preventDefault(); 
    });
</script>
这需要为每个点击事件添加一个 <script> 标签,从而使代码更加复杂。
2021-04-18 10:49:47
@ somid3,而jQuery是没有必要的,如果你担心性能,你可以使用一个委托的事件处理程序,以便你只安装一个侦听器这样的页面上的所有锚:$("body").on("click","a",function(e) { e.preventDefault() });在任何一种情况下,两种解决方案都不会对性能产生有意义的影响。
2021-04-18 10:49:47
这里也不同意,对内联函数的简单解析更有效,代码更少。
2021-04-21 10:49:47
它还需要 jQuery,虽然它可能存在,但不应该是先决条件。
2021-05-04 10:49:47
<script type="text/javascript">
$('a').click(function(){
   return false;
});
<script>
另外,当使用 jQuery 时,return false不推荐使用,因为它还会阻止该元素上的所有其他事件处理程序运行,并阻止事件冒泡到更高的元素。
2021-04-25 10:49:47
这适用于每个锚点,并会破坏所有链接,还需要在页面上插入 javascript 以及 jQuery。
2021-05-03 10:49:47

向链接添加一个独特的类和一个 javascript,以防止默认使用此类链接:

<a href="#" class="prevent-default" 
   onclick="$('.comment .hidden').toggle();">Show comments</a>

<script>
  $(document).ready(function(){

    $("a.prevent-default").click(function(event) {
         event.preventDefault(); 
          });
  });
</script>
全局解决方案的有趣方法。
2021-05-03 10:49:47