僅當使用jquery或javascript的頁數超過一個時，才顯示第一頁和最后一頁？

Question

我有兩個這樣的按鈕：

 <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完成嗎？ 謝謝

Answer 1

如何為每個按鈕添加一個通用類，例如：

<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();
}

Answer 2

給頁面長度數字的包裝帶一個類/ 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/