在后增量中仅显示精确数字前后的 3 个数字答案

【问题标题】：Show 3 numbers only before and after of an exact number in a post-increment在后增量中仅显示精确数字前后的 3 个数字
【发布时间】：2019-05-16 22:47:21
【问题描述】：

我不知道如何问这个问题。如果我确切地知道要寻找什么，我可能不必在这里发帖。我会解释一下情况，我希望你们能告诉我究竟要寻找什么（或什么类型的功能）。这是我正在处理的代码 -

$walkaround_pages = 15;
$walkaround_page = $_GET['walkaround_page'];
for ($wp = 1; $wp <= $walkaround_pages; $wp++) {
    echo '<a class="pagination_links'.(($wp==$walkaround_page)?' current_page':"").'" href="/panel/?walkaround_page='.$wp.'">'.$wp.'</a>';
}

这会生成分页链接。当总页数($walkaround_pages) 超过 10 时，它无法适应移动设备。所以我想做一些事情，如果当前页面 ($walkaround_page) 假设是 7，它只会显示 (4,5,6) 之前的 3 个数字和 (8,9,10) 之后的 3 个数字，而不是显示所有数字 1 到 15。谁能告诉我我到底在找什么？

【问题讨论】：

听起来可以（应该？）用 CSS 的 @media 规则解决。
它可以用css解决，也可以用JS解决，但我只想加载会出现的链接，而不是加载所有内容并停止显示其他链接。 @Accountant م 答案是我要找的
一切顺利！我个人喜欢动态内容显示，它为用户提供最大的灵活性。鉴于如今的动态屏幕（旋转、2 合 1 显示、浏览器选项卡被拖动并捕捉到窗口边缘），流畅的设计非常有用。在 PHP 中执行此类操作非常受限或需要回调服务器。
我喜欢你的想法。我将尝试更多地依赖 css，这可以用 css 完成，而不是给服务器更多的压力。谢谢

标签： php post-increment

【解决方案1】：

这是一个使用 @media 规则的 CSS 示例。

关于这一点的重要部分是你可以让它成为一个非常流畅的设计。例如，当用户旋转他们的设备时，将显示额外的链接。

如果用户调整浏览器窗口的大小，则相同。

.wide a, .narrow a {
  padding:0px 0.5em;
}
.wide a:hover, .narrow a:hover {
  color:#fff;
  background:#345;
}

/* this would be in your @media rule */
/* @media screen and (max-width: 480px) { */ 
.narrow a:nth-of-type(n+6) {
  display:none;
}
/* } */

<p>For demonstration only</p>
<div class="wide">
<a href="#">1</a> <a href="#">2</a> <a href="#">3</a>
<a href="#">4</a> <a href="#">5</a> <a href="#">6</a>
<a href="#">7</a> <a href="#">8</a> <a href="#">9</a>
<a href="#">10</a>
</div>

<p>Below is all you would have</p>
<div class="narrow">
<a href="#">1</a> <a href="#">2</a> <a href="#">3</a>
<a href="#">4</a> <a href="#">5</a> <a href="#">6</a>
<a href="#">7</a> <a href="#">8</a> <a href="#">9</a>
<a href="#">10</a>
</div>

【讨论】：

【解决方案2】：

您可以计算出相对于您当前所在页面的循环的开始和结束部分，然后循环...

$walkaround_pages = 15;
$max_gap = 3;      // How many pages before and after you want
$walkaround_page = $_GET['walkaround_page'];
$start = max(1,$walkaround_page-$max_gap);
$end = min($walkaround_pages,$walkaround_page+$max_gap);
for ($wp = $start; $wp <= $end; $wp++) {

start是减去item数的情况，但要确保1是最小的，与end类似的是增加页数但限制在总页数。

【讨论】：

您的方法更高效，因为它节省了不必要的循环迭代
同意@Accountantم

【解决方案3】：

在回显之前添加一个条件

if( abs($wp - $walkaround_page) <= 3){
        echo '<a class="pagination_links'.(($wp==$walkaround_page)?' current_page':"").'" href="/panel/?walkaround_page='.$wp.'">'.$wp.'</a>';
}

abs 函数将返回绝对值，因此如果它是比当前页面更小或更大的 3 个数字之一，它将返回正数

见live demo

【讨论】：

正是我想要的！谢谢。