Question

根据Bootstrap文档，分页语法如下：

<ul class="pagination">
  <li><a href="#">&laquo;</a></li>
  <li><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="#">5</a></li>
  <li><a href="#">&raquo;</a></li>
</ul>

我得出的结论是，有必要在<a>标记内包含<li>标记，以使分页看起来像Bootstrap设计。但是我想使用JS脚本作为点击操作而不是跳转到指定的URL。如果我使用'＃'符号作为href属性，这个hashtag将出现在Web浏览器地址行中，这不是真正的“漂亮”，甚至可能从我的角度造成一些错误。

那我该怎么办？忽视？剥离标签并留下空引号？深入了解CSS以使分页看起来正确而不依赖于使用<a>标记？

Answer 1

只需在onclick属性中添加return false即可解决此问题。它看起来像这样：

<ul class="pagination">
    <li><a href="#" onclick="yourJsFunction(); return false;">&laquo;</a></li>
    <li><a href="#" onclick="yourJsFunction(); return false;">1</a></li>
    <li><a href="#" onclick="yourJsFunction(); return false;">2</a></li>
    <li><a href="#" onclick="yourJsFunction(); return false;">3</a></li>
    <li><a href="#" onclick="yourJsFunction(); return false;">4</a></li>
    <li><a href="#" onclick="yourJsFunction(); return false;">5</a></li>
    <li><a href="#" onclick="yourJsFunction(); return false;">&raquo;</a></li>
</ul>

这样将调用JS-Function，但浏览器不会重定向到链接的href。

引导分页和<a> inside the <li> tags</li></a>的使用

1 个答案: