html - Bootstrap 分页中的禁用链接

Question

我正在尝试使用 Bootstrap 的分页样式。文档说要像这样创建页面列表:

<div class="pagination">
    <ul>
        <li class="disabled"><a href="#">&laquo;</a></li>
        <li class="active"><a href="#">1</a></li>
        <li><a href="#">2</a></li>
        <li><a href="#">3</a></li>
        <li><a href="#">4</a></li>
        <li><a href="#">&raquo;</a></li>
    </ul>
</div>

前两个链接，左箭头和 1，应该被禁用。但是，当我将它合并到我的 django 模板中时，这两个仍然可用。单击它们会将用户发送到页面顶部，就像任何其他带有 id“#”的 anchor 链接一样。我想我仍然必须有它才能让 Bootstrap 正确设置样式。

有没有一种方法可以编写此代码，以便当用户单击其中一个禁用的“按钮”时它不会执行任何操作？

Answer 1

在文档中，这些按钮只是手动禁用的。它与 .pagination 样式无关。

你可以用那个

$('.pagination .disabled a, .pagination .active a').on('click', function(e) {
    e.preventDefault();
});

注意:如果您使用基于 ajax 的分页，则必须将这段代码放在更新处理程序中或使用 delegated events相反