<a>标记上的preventDefault（）

Question

当单击链接时，我有一些html / jquery可以上下滑动div以显示/隐藏它：<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>$('div.toggle').hide();$('ul.product-info li a').click(function(event){  $(this).next('div').slideToggle(200);}我的问题是：如何使用preventDefault()链接来停止链接并将其添加#到URL的末尾并跳至页面顶部？我找不到正确的语法，只是不断收到一个错误消息，指出preventDefault（）不是函数。

Answer 1

尝试类似：

$('div.toggle').hide();

$('ul.product-info li a').click(function(event) {

    event.preventDefault();

    $(this).next('div').slideToggle(200);

});

这是jQuery文档中有关该页面的页面

Answer 2

将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>

Answer 3

建议您不要使用return false，因为这样会导致3种情况：

event.preventDefault（）;

event.stopPropagation（）;

停止回调执行，并在调用后立即返回。

因此，在这种情况下，您实际上应该只使用 event.preventDefault();

文章存档-jQuery Events：Stop（Mis）使用Return False

Answer 4

<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：void（0）;