0

我有两个这样的按钮:

 <button class="next_prev" onclick="" id="first_buttons" disabled>{{ pages.first }}</button>
<button class="next_prev" onclick="" id="last_buttons" disabled>{{ pages.last }}</button>

如果默认只有一页,页面 {{ pages.first }} 和 {{ pages.last }} 存储页码 1 和 1 并显示它。但是如果页码大于 1,我只想显示这两个按钮。我得到的页面长度如下:

<p> <span>{% get_pages %} {{ pages|length }} pages</span> </p>

可以在 jquery 或 javascript 中完成吗?谢谢

4

2 回答 2

0

如何为每个按钮添加一个公共类,例如:

<button class="next_prev pageNumberBtn" onclick="" id="first_buttons" disabled>{{ pages.first }}</button>

<button class="next_prev pageNumberBtn" onclick="" id="last_buttons" disabled>{{ pages.last }}</button>

如果最后页码为 1,则隐藏按钮:

if ($('#last_buttons').html() == '1') {
    $('.pageNumberBtn').hide();
}
于 2013-03-14T09:26:15.103 回答
0

使用类/ID 给出页长编号的包装器。例如:

<p id="num-of-pages"><span>{% get_pages %} {{ pages|length }} pages</span></p>

如果上面代码的输出只产生了一些数字,你可以使用下面的 jQuery 代码来隐藏按钮:

var numOfPages = $('#num-of-pages').text();

if (numOfPages <= 1 ){
    $('.next_prev').hide();
}

此处的小提琴示例:http: //jsfiddle.net/shodaburp/56kbj/

PS:只是一个提示 - 因为 .next_prev 是一个非常通用的名称,您可能已经将此类用于其他一些元素,最好为您想要隐藏的这两个按钮提供一些 ID。

更新(基于 user2032220 的第二条评论):

如果{% get_pages %} {{ pages|length }}实际输出“Pages 1”,那么最简单的解决方案之一是将页面长度包装在另一个 span 标签中。例如:

<p id="num-of-pages"><span>{% get_pages %} <span>{{ pages|length }}</span></span></p>

然后隐藏按钮的代码将更改:

var numOfPages = $('#num-of-pages span span').text();

小提琴示例:http: //jsfiddle.net/shodaburp/56kbj/1/

于 2013-03-14T09:30:42.543 回答