Question

下面是服务器端的jquery ajax函数和load.php文件，该文件应该从我站点上的不同目录动态加载页面，但它没有完全正常工作。它只会在我的导航菜单#Browse_Page1和#Charts_Page1中加载第一页和最后一页，但它从不加载其余页面。这是我的导航菜单。

 <nav>
 <ul id='menu' class="menu-items">
 <li><a href="#Browse_Page1" class="albums active" id="page1-link"><i class="arcd-archive"></i></br>Browse</a></li>
 <li><a href="#Top_albums_Page1" class="pages" id="page2-link"><i class="arcd-music97"></i></br>Top albums</a></li>
 <li><a href="#Top_artists_Page1" class="albums" id="page3-link"><i class="arcd-microphone52"></i></br>Top artists</a></li>
 <li><a href="#Top_lists_Page1" class="pages" id="page4-link"><i class="arcd-numbered8"></i></br>Top lists</a></li>
 <li><a href="#Charts_Page1" class="pages" id="page4-link"><i class="arcd-rising9"></i></br>Charts</a></li>
 </ul>
 </nav>

这是jquery ajax函数

  $(function () {
  $('header nav a').on('click', function () {
    var linkClicked = $(this).attr('href');
    var data = {
        page      : linkClicked.replace(/\D/g, ''),
        directory : linkClicked.replace(/(_Page(.*)|#)/g,'')
    }

    $("header nav a").removeClass("active");
    $(this).addClass("active");
    $('#loading').css('visibility', 'visible');

    $.post('load.php', data, function(msg) {
        $('#main-content').html(msg);
        $('#loading').css('visibility', 'hidden');
        $('#main-content section').hide().fadeIn();
    }, 'html');
   });
  });

最后这是服务器端的load.php

  <?php
  $page = filter_var( $_POST['page'], FILTER_VALIDATE_INT);
  $dir  = filter_var( $_POST['directory'], FILTER_SANITIZE_STRING);
  if ( $page !== false && $dir !== false ) {
    $link = $dir . '/' . $dir . '_Page' . $page . '.html';
    if ( file_exists( $link ) ) {
        echo file_get_contents( $link );
    } else {
        echo 'There is no such page!';
    }
   }
 ?>

任何人都知道我错了或者我错过了什么，请帮我摆脱这个。提前谢谢。

使用jquery ajax动态加载页面不能完全正常工作

0 个答案: