[英]Show first and last page only when there is more than one page number using jquery or javascript?
I have two buttons like this: 我有两个这样的按钮:
<button class="next_prev" onclick="" id="first_buttons" disabled>{{ pages.first }}</button>
<button class="next_prev" onclick="" id="last_buttons" disabled>{{ pages.last }}</button>
If there is only one page by default the page {{ pages.first }} and {{ pages.last }} store the page number 1 and 1 and show it. 如果默认情况下只有一页,则页面{{pages.first}}和{{pages.last}}将存储页码1和1并显示。 But I only want to show these two buttons if page number is great than 1. I get page length like this:
但是,我只想在页码大于1的情况下显示这两个按钮。我得到这样的页面长度:
<p> <span>{% get_pages %} {{ pages|length }} pages</span> </p>
Can it be done in jquery or javascript? 可以用jquery或javascript完成吗? Thanks
谢谢
How about adding a common class to each button, eg: 如何为每个按钮添加一个通用类,例如:
<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>
Then hide the buttons if the last page number is 1: 如果最后一页为1,则隐藏按钮:
if ($('#last_buttons').html() == '1') {
$('.pageNumberBtn').hide();
}
Give the wrapper of the page length number with a class/ID. 给页面长度数字的包装带一个类/ ID。 For example:
例如:
<p id="num-of-pages"><span>{% get_pages %} {{ pages|length }} pages</span></p>
If the output of the above code only churns out some numbers only, you can use this jQuery code below to hide the buttons: 如果以上代码的输出仅产生一些数字,则可以使用下面的jQuery代码隐藏按钮:
var numOfPages = $('#num-of-pages').text();
if (numOfPages <= 1 ){
$('.next_prev').hide();
}
Example fiddle here: http://jsfiddle.net/shodaburp/56kbj/ 示例小提琴在这里: http : //jsfiddle.net/shodaburp/56kbj/
PS: Just a tip - since .next_prev is quite a generic name and you might have used this class for some other elements, better to give some IDs to those two buttons that you want to hide. PS:只是一个提示-由于.next_prev是一个通用名称,您可能已将此类用于其他元素,所以最好为要隐藏的这两个按钮提供一些ID。
UPDATE (Based on user2032220's second comment): 更新(基于user2032220的第二条评论):
If {% get_pages %} {{ pages|length }}
actually output "Pages 1" then one of the easiest solution is to wrap the page length in another span tag. 如果
{% get_pages %} {{ pages|length }}
实际上输出“ Pages 1”,那么最简单的解决方案之一就是将页面长度包装在另一个span标签中。 For example: 例如:
<p id="num-of-pages"><span>{% get_pages %} <span>{{ pages|length }}</span></span></p>
Then the code to hide the buttons would be to change: 然后,隐藏按钮的代码将更改:
var numOfPages = $('#num-of-pages span span').text();
Example fiddle: http://jsfiddle.net/shodaburp/56kbj/1/ 小提琴示例: http : //jsfiddle.net/shodaburp/56kbj/1/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.