Question

我有这个电影片名表，并且带有标题的单元格内部是一个隐藏的div。在div中，我放置了包含电影摘要的文本。我希望用户能够切换电影摘要。到目前为止，切换按钮正在工作。不幸的是，无论何时单击按钮，页面上的位置都会跳跃。

有没有办法在不使页面位置跳跃的情况下使用切换功能？

编辑：

这是我的切换代码

$(document).ready(function(){
    $("#button1").click(function(){
        $("p.desc").toggle();
     });
});

以下是HTML示例：

<button id="button1">Toggle Summaries</button>
<table border="1">
    <tr>
       <th>Title</th>
       <th>Release Date</th>
    </tr>
    <tr>
       <td>2001: A Space Odyssey
          <div><p class="desc"><!--Summary of movie here--></p></div>
       </td>
    </tr>
</table>

Answer 1

在切换锚点击处理程序的开头调用preventDefault函数。这将阻止链接触发其默认点击操作（我猜你会设置你的href="#"并将其跳转到当前页面的顶部。）

$('#summary-toggle').click(function(e){
    e.preventDefault();
    // Your toggling code
});

感谢Sparky672获取preventDefault上的提示。从事件处理程序返回false不是停止默认操作的最佳方法。

jQuery切换混乱页面位置

1 个答案: