JavaScript分页突出显示第一页上的最后一个选项卡

谢谢你的帮助-这里有新的编码员

分页有问题（每页显示20篇文章的新闻页面-总共有5页通过表格单元格导航）。选择“新闻页面选项”类后，下面的代码将活动类（突出显示所选页码）添加到当前页面。通过选择顶部菜单上的“新闻”可访问默认新闻页面。网址是www.website.com/news

问题是：

---

转到默认新闻页面（www.website.com/news）时，会突出显示页面上显示的最后一个数字（请参见下图中的#5）。我希望在您访问www.website.com/news时突出显示第一个数字（1）

作为参考，如果选择了第二页（查看帖子21-41），URL将更改为www.website.com/news？p=2（“/news？p=3”是第3页的文章，以此类推）

---

代码如下：

HTML:

CSS:

---

转到默认新闻页--如何转到默认新闻页？您正在刷新页面吗？嘿@user1531038，我通过顶部导航菜单进入默认新闻页面。只有当您在导航到第5页或其他任何页面后进入默认页面时，才会出现这种行为？我的意思是，如果我导航到第3页，然后导航到默认页，突出显示的页码是3或5？@user1531038-好问题，在这种情况下，突出显示的页面是5（尽管它应该是1）。有两个URL。默认值为www.website.com/news，查看第2、3、4或5页的页面为www.website.com/news？p=2或/news？p=3。不确定这种奇怪的行为。。如果（！results）返回“1”，可以尝试

而不是
null
<table class="news-pages" id="paginator">
  <tr>
    <% for(var i = 1; i <= num_pages; i++) { %>
      <td class="news-pages-option"><%-i%></td>
    <% } %>
  </tr>
 </table>

  $('#paginator tr td').on('click', function(){
    var loc = window.location;
    window.location = `${loc.protocol + '//' + loc.host + loc.pathname}? 
    p=${$(this).html()}`;
  });

  function getParameterByName(name, url) {
  if (!url) url = window.location.href;
  name = name.replace(/[\[\]]/g, "\\$&");
  var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
      results = regex.exec(url);
  if (!results) return null;
  if (!results[2]) return '';
  return decodeURIComponent(results[2].replace(/\+/g, " "));
  }

  const page = getParameterByName('p') - 1;
  $('.news-pages-option:eq(' + page + ')').addClass('active');

.news-pages-option {
  border: 2px solid #cccccc;
  border-radius: 3px;
  background-color: #FAFAFA;
  padding: 3px 6px 3px 6px;
  font-size: 14px;
  text-decoration: none;
  cursor: pointer;
 }

.news-pages-option:hover {
  background-color: #e1e1e1;
}

.news-pages-option.active {
  background-color: #cccccc;
  border: none;
  padding: 3px 8px 3px 8px;
  text-decoration: underline;
 }

.news-pages-option.active:hover {
  background-color: #e1e1e1;
  border: 2px solid #cccccc;
  padding: 3px 6px 3px 6px;
  text-decoration: none;
 }