Javascript 创建上一页按钮

我正在尝试创建一种使用Prev和Next按钮在页面之间导航的方法。按钮使用引导和字体图标制作，如下所示：

正在使用的软件是

我已使用以下代码创建了一个下一页按钮：

<a href="<?php echo $chapter->next_page($current_page); ?>" onClick="return nextPage();" >
   <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-right"></i></button>
</a>

如何创建一个与当前下一页工作方式相同的prev按钮页面

我试过history.goback，但正是这样，根据你的历史可以追溯到上一页

非常感谢

编辑：在下面添加更多详细信息作为答案

函数加载页（一）{
$（'page'）.html（i）.attr（'page'，i）；
href='/pages/'+i+'.php'；
$（“#加载”）.load（href）；
}
$（“#下一步”）。单击（函数（）{
var n=parseInt（$（'#page'）.attr（'page'））；
var m=$（'#page'）.attr（'maxpage'）；
n++；
if（n0）{
加载页（n）；
}
})

2.
0

您可以通过普通javascript代码执行此操作，如下所示：

HTML:

<a href="javascript:void(0);" onClick="return prevPage();" >Prev</a>

function prevPage(){
    //assuming that the current page count will always be at the end of URL
    // /reader/read/test/en/0/0/page/10
    //here current page number is 10
    var currentPage = window.location.pathname.split("page/")[1];
    var currentPage = parseInt(currentPage);
    var prevPage = 1;
    if(currentPage > 1)
        prevPage = currentPage - 1;
    else
        return; //return if we are on 1st page

    window.location.href =  window.location.href.replace(currentPage,prevPage);
}

 /**
       * Returns the URL for the next page in the same chapter. It's used for
       * page-change in systems that don't support JavaScript.
       *
       * @author  Woxxy
       * @todo  this function has a quite rough method to work, though it saves
       *       lots of calc power. Maybe it can be written more elegantly?
       * @return  string with href to next page
       */

      public function next_page($page, $max = 0)
      {
        if ($max != 0 && $max > $page)
          return $this->next();

        $url = current_url();
        // If the page hasn't been set yet, just add to the URL.
        if (!$post = strpos($url, '/page'))
        {
          return current_url() . 'page/' . ($page + 1);
        }
        // Just remove everything after the page segment and readd it with proper number.
        return substr(current_url(), 0, $post) . '/page/' . ($page + 1);
      }

public function prev_page($page, $max = 0)
  {
    if ($max != 0 && $max > $page)
      return $this->prev();

    $url = current_url();
    // If the page hasn't been set yet, just add to the URL.
    if (!$post = strpos($url, '/page'))
    {
      return current_url() . 'page/' . ($page - 1);
    }
    // Just remove everything after the page segment and readd it with proper number.
    return substr(current_url(), 0, $post) . '/page/' . ($page - 1);
  }   

 <a href="<?php echo $chapter->prev_page($current_page); ?>">
             <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-left"></i></button>
        </a>

 <a href="<?php echo $chapter->next_page($current_page); ?>">
                 <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-right"></i></button>
            </a>

---

在查看章节模型中的next_page函数后，我能够使用相同的格式创建prev_page函数我想确定这是否是解决此问题的正确方法。我对PHP很陌生。

原来的下一页功能：

<a href="javascript:void(0);" onClick="return prevPage();" >Prev</a>

function prevPage(){
    //assuming that the current page count will always be at the end of URL
    // /reader/read/test/en/0/0/page/10
    //here current page number is 10
    var currentPage = window.location.pathname.split("page/")[1];
    var currentPage = parseInt(currentPage);
    var prevPage = 1;
    if(currentPage > 1)
        prevPage = currentPage - 1;
    else
        return; //return if we are on 1st page

    window.location.href =  window.location.href.replace(currentPage,prevPage);
}

 /**
       * Returns the URL for the next page in the same chapter. It's used for
       * page-change in systems that don't support JavaScript.
       *
       * @author  Woxxy
       * @todo  this function has a quite rough method to work, though it saves
       *       lots of calc power. Maybe it can be written more elegantly?
       * @return  string with href to next page
       */

      public function next_page($page, $max = 0)
      {
        if ($max != 0 && $max > $page)
          return $this->next();

        $url = current_url();
        // If the page hasn't been set yet, just add to the URL.
        if (!$post = strpos($url, '/page'))
        {
          return current_url() . 'page/' . ($page + 1);
        }
        // Just remove everything after the page segment and readd it with proper number.
        return substr(current_url(), 0, $post) . '/page/' . ($page + 1);
      }

public function prev_page($page, $max = 0)
  {
    if ($max != 0 && $max > $page)
      return $this->prev();

    $url = current_url();
    // If the page hasn't been set yet, just add to the URL.
    if (!$post = strpos($url, '/page'))
    {
      return current_url() . 'page/' . ($page - 1);
    }
    // Just remove everything after the page segment and readd it with proper number.
    return substr(current_url(), 0, $post) . '/page/' . ($page - 1);
  }   

 <a href="<?php echo $chapter->prev_page($current_page); ?>">
             <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-left"></i></button>
        </a>

 <a href="<?php echo $chapter->next_page($current_page); ?>">
                 <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-right"></i></button>
            </a>

上一页：

<a href="javascript:void(0);" onClick="return prevPage();" >Prev</a>

function prevPage(){
    //assuming that the current page count will always be at the end of URL
    // /reader/read/test/en/0/0/page/10
    //here current page number is 10
    var currentPage = window.location.pathname.split("page/")[1];
    var currentPage = parseInt(currentPage);
    var prevPage = 1;
    if(currentPage > 1)
        prevPage = currentPage - 1;
    else
        return; //return if we are on 1st page

    window.location.href =  window.location.href.replace(currentPage,prevPage);
}

 /**
       * Returns the URL for the next page in the same chapter. It's used for
       * page-change in systems that don't support JavaScript.
       *
       * @author  Woxxy
       * @todo  this function has a quite rough method to work, though it saves
       *       lots of calc power. Maybe it can be written more elegantly?
       * @return  string with href to next page
       */

      public function next_page($page, $max = 0)
      {
        if ($max != 0 && $max > $page)
          return $this->next();

        $url = current_url();
        // If the page hasn't been set yet, just add to the URL.
        if (!$post = strpos($url, '/page'))
        {
          return current_url() . 'page/' . ($page + 1);
        }
        // Just remove everything after the page segment and readd it with proper number.
        return substr(current_url(), 0, $post) . '/page/' . ($page + 1);
      }

public function prev_page($page, $max = 0)
  {
    if ($max != 0 && $max > $page)
      return $this->prev();

    $url = current_url();
    // If the page hasn't been set yet, just add to the URL.
    if (!$post = strpos($url, '/page'))
    {
      return current_url() . 'page/' . ($page - 1);
    }
    // Just remove everything after the page segment and readd it with proper number.
    return substr(current_url(), 0, $post) . '/page/' . ($page - 1);
  }   

 <a href="<?php echo $chapter->prev_page($current_page); ?>">
             <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-left"></i></button>
        </a>

 <a href="<?php echo $chapter->next_page($current_page); ?>">
                 <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-right"></i></button>
            </a>

之后，我分别用以下代码替换上一页和下一页按钮的代码：

上一页：

<a href="javascript:void(0);" onClick="return prevPage();" >Prev</a>

function prevPage(){
    //assuming that the current page count will always be at the end of URL
    // /reader/read/test/en/0/0/page/10
    //here current page number is 10
    var currentPage = window.location.pathname.split("page/")[1];
    var currentPage = parseInt(currentPage);
    var prevPage = 1;
    if(currentPage > 1)
        prevPage = currentPage - 1;
    else
        return; //return if we are on 1st page

    window.location.href =  window.location.href.replace(currentPage,prevPage);
}

 /**
       * Returns the URL for the next page in the same chapter. It's used for
       * page-change in systems that don't support JavaScript.
       *
       * @author  Woxxy
       * @todo  this function has a quite rough method to work, though it saves
       *       lots of calc power. Maybe it can be written more elegantly?
       * @return  string with href to next page
       */

      public function next_page($page, $max = 0)
      {
        if ($max != 0 && $max > $page)
          return $this->next();

        $url = current_url();
        // If the page hasn't been set yet, just add to the URL.
        if (!$post = strpos($url, '/page'))
        {
          return current_url() . 'page/' . ($page + 1);
        }
        // Just remove everything after the page segment and readd it with proper number.
        return substr(current_url(), 0, $post) . '/page/' . ($page + 1);
      }

public function prev_page($page, $max = 0)
  {
    if ($max != 0 && $max > $page)
      return $this->prev();

    $url = current_url();
    // If the page hasn't been set yet, just add to the URL.
    if (!$post = strpos($url, '/page'))
    {
      return current_url() . 'page/' . ($page - 1);
    }
    // Just remove everything after the page segment and readd it with proper number.
    return substr(current_url(), 0, $post) . '/page/' . ($page - 1);
  }   

 <a href="<?php echo $chapter->prev_page($current_page); ?>">
             <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-left"></i></button>
        </a>

 <a href="<?php echo $chapter->next_page($current_page); ?>">
                 <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-right"></i></button>
            </a>

下一页：

<a href="javascript:void(0);" onClick="return prevPage();" >Prev</a>

function prevPage(){
    //assuming that the current page count will always be at the end of URL
    // /reader/read/test/en/0/0/page/10
    //here current page number is 10
    var currentPage = window.location.pathname.split("page/")[1];
    var currentPage = parseInt(currentPage);
    var prevPage = 1;
    if(currentPage > 1)
        prevPage = currentPage - 1;
    else
        return; //return if we are on 1st page

    window.location.href =  window.location.href.replace(currentPage,prevPage);
}

 /**
       * Returns the URL for the next page in the same chapter. It's used for
       * page-change in systems that don't support JavaScript.
       *
       * @author  Woxxy
       * @todo  this function has a quite rough method to work, though it saves
       *       lots of calc power. Maybe it can be written more elegantly?
       * @return  string with href to next page
       */

      public function next_page($page, $max = 0)
      {
        if ($max != 0 && $max > $page)
          return $this->next();

        $url = current_url();
        // If the page hasn't been set yet, just add to the URL.
        if (!$post = strpos($url, '/page'))
        {
          return current_url() . 'page/' . ($page + 1);
        }
        // Just remove everything after the page segment and readd it with proper number.
        return substr(current_url(), 0, $post) . '/page/' . ($page + 1);
      }

public function prev_page($page, $max = 0)
  {
    if ($max != 0 && $max > $page)
      return $this->prev();

    $url = current_url();
    // If the page hasn't been set yet, just add to the URL.
    if (!$post = strpos($url, '/page'))
    {
      return current_url() . 'page/' . ($page - 1);
    }
    // Just remove everything after the page segment and readd it with proper number.
    return substr(current_url(), 0, $post) . '/page/' . ($page - 1);
  }   

 <a href="<?php echo $chapter->prev_page($current_page); ?>">
             <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-left"></i></button>
        </a>

 <a href="<?php echo $chapter->next_page($current_page); ?>">
                 <button type="button" class="btn btn-info" id="next-page"><i class="fa fa-chevron-right"></i></button>
            </a>

这是一个可以接受的解决方案吗

---

非常感谢你们的帮助，伙计们

难道你没有一个函数

$chapter->prev\u page（$current\u page）？取决于分页的方式。如果您只是简单地使用页码，那么肯定可以创建类似于当前下一页函数的内容？您的
下一页
函数看起来像什么？
.load（href）无法加载不存在的页面，因此div不会发生任何变化