我希望用户能够选择每页显示10、20或30篇文章。

我找到了这个Let user change posts per page 但它不起作用。

我发现this 并实现了它，但我得到了一个jquery错误。Uncaught TypeError: e.indexOf is not a function

这是我的代码：（我正在使用Bootstrap 4）

<?php

  if( isset($_GET[\'pageVal\']) ) {
    $showposts = esc_sql($_GET[\'pageVal\']);
  } else {
    $showposts = 10;
  }

  $paged = (get_query_var(\'paged\')) ? get_query_var(\'paged\') : 1;
  $newsposts = array(
    \'posts_per_page\' => $showposts,
    \'paged\' => $paged,
    \'category_name\' => \'News\'
  );
  query_posts($newsposts);
?>
<?php if ( have_posts(\'newsposts\') ) : ?>
<section class="blue">
  <div class="container">
    <div class="row">
      <div class="col d-flex justify-content-start px-sm-4 white-text">
        <span class="font-weight-bold p-2 mr-3">Title Filter</span>
        <?php echo do_shortcode(\'[wpdreams_ajaxsearchlite]\'); ?>
        <span class="font-weight-bold p-2">Display #</span>
        <select id="news-posts-per-page" class="page-select">
          <option value="10">10</option>
          <option value="20">20</option>
          <option value="30">30</option>
        </select>
        <script>
        jQuery(document).ready(function( $ ) {
          $(\'.page-select\').change(function(){
            var checkIndex = window.location.href.indexOf(\'?\');
            if( checkIndex > -1 ){
              var Link = window.location.href.substr(0, checkIndex-1);
              $(location).attr(\'href\', Link+\'?page=\'+$(\'.page-select\').val());
            } else {
              $(location).attr(\'href\', window.location.href+\'?page=\'+$(\'.page-select\').val());
            }
          });

        });
        </script>
        <span class="font-weight-bold pl-1 py-2"><i class="fas fa-sort"></i></span>
      </div>
    </div>
  </div>
</section>