对<a>标签使用preventDefault（）
我有一些HTML / jQuery的幻灯片上下显示/隐藏它，当一个链接被点击：
<ul class="product-info"> <li> <a href="#">YOU CLICK THIS TO SHOW/HIDE</a> <div class="toggle"> <p>CONTENT TO SHOW/HIDE</p> </div> </li> </ul> 和我的jquery
$('div.toggle').hide(); $('ul.product-info li a').click(function(event){ $(this).next('div').slideToggle(200); } );
我的问题是：我如何使用preventDefault（）来停止作为链接的链接，并添加＃到我的URL的末尾跳转到页面的顶部？ 我无法弄清楚正确的语法，我只是不断收到一个错误，说preventDefault（）不是一个函数。
尝试类似
$('div.toggle').hide(); $('ul.product-info li a').click(function(event) { event.preventDefault(); $(this).next('div').slideToggle(200); });
以下是jQuery文档中的相关页面：
build议您不要使用return false ，因为会发生3件事情：
- event.preventDefault（）;
- event.stopPropagation（）;
- 停止callback执行，并在调用时立即返回。
所以在这种情况下，你应该只使用event.preventDefault();
文章归档 – jQuery Events：Stop（Mis）使用Return False
将href属性设置为href =“javascript :;”
<ul class="product-info"> <li> <a href="javascript:;">YOU CLICK THIS TO SHOW/HIDE</a> <div class="toggle"> <p>CONTENT TO SHOW/HIDE</p> </div> </li> </ul>
或者，您可以从click事件中返回false：
$('div.toggle').hide(); $('ul.product-info li a').click(function(event){ $(this).next('div').slideToggle(200); + return false; });
这将阻止A-Href被触发。
但是，请注意，出于可用性的原因，在一个理想的世界里，href还是应该去的地方，对于想要打开新标签链接的人来说）
这是我刚刚testing的非JQuery解决scheme，它的工作原理。
<html lang="en"> <head> <script type="text/javascript"> addEventListener("load",function(){ var links= document.getElementsByTagName("a"); for (var i=0;i<links.length;i++){ links[i].addEventListener("click",function(e){ alert("NOPE!, I won't take you there haha"); //prevent event action e.preventDefault(); }) } }); </script> </head> <body> <div> <ul> <li><a href="http://www.google.com">Google</a></li> <li><a href="http://www.facebook.com">Facebook</a></li> <p id="p1">Paragraph</p> </ul> </div> <p>By Jefrey Bulla</p> </body> </html>
<ul class="product-info"> <li> <a href="javascript:void(0);">YOU CLICK THIS TO SHOW/HIDE</a> <div class="toggle"> <p>CONTENT TO SHOW/HIDE</p> </div> </li> </ul>
使用
的javascript：无效（0）;
为什么不在CSS中做？
取出锚标记中的“href”属性
<ul class="product-info"> <li> <a>YOU CLICK THIS TO SHOW/HIDE</a> <div class="toggle"> <p>CONTENT TO SHOW/HIDE</p> </div> </li> </ul>
在你的CSS中，
a{ cursor: pointer; }
经过几次操作，当页面最终应该去链接，你可以做到以下几点：
jQuery("a").click(function(e){ var self = jQuery(this); var href = self.attr('href'); e.preventDefault(); // needed operations window.location = href; });
如果停止事件的传播不会打扰你，只要使用
return false;
在你的处理程序结束。 在jQuery中，它可以防止默认行为，并停止事件冒泡。
你可以使用return false; 从事件调用来停止事件传播，它就像一个event.preventDefault(); 否定它。 或者，您可以在href属性中使用javascript:void(0)来评估给定的expression式，然后将undefined返回给元素。
当它被调用时返回事件：
<a href="" onclick="return false;"> ... </a>
无效情况：
<a href="javascript:void(0);"> ... </a>
你可以看到更多的关于： 添加void（0）的href和'返回false'锚点标记的点击事件监听器的影响是什么？
