Question

大家好，祝大家新年快乐：）

我不是阿贾克斯的老板，我遇到了一些我无法解决的问题。

我有一个包含ajax动态导航的页面，我有多个我可以加载的php文件。

这是我在此页面中的导航

<section id="sub-nav">
    <div class="container-fluid">
        <ul>
            <li><a href="#" class="little-button" id="ajax-media">Media</a></li>
            <li><a href="#" class="little-button" id="ajax-business">Business</a></li>
            <li><a href="#" class="little-button" id="ajax-events">Events</a></li>
            <li><a href="#" class="little-button" id="ajax-music-business">Music Business</a></li>
            <li><a href="#" class="little-button" id="ajax-institutions">Institutions</a></li>
        </ul>
    </div>
</section>

每个按钮调用这样的页面

$('#ajax-media').click(function(){
    event.preventDefault();
    $('#solution-wrapper').fadeOut('slow', function(){
      $('#solution-wrapper').load('../solution-media.php', function(){
        $(this).fadeIn('slow');
      });
    });
  });

我想在更改内容时重写网址，我想在浏览器中解析网址时直接访问内容。

你们可以帮助我在我的代码中没有太多问题的情况下开始新的一年吗？我怎么能做这些事情？非常感谢你:)）

Answer 1

新年快乐

当你说改写url你想要什么样的格式？示例：您想要它说http://example.com/solution-media.php吗？

使用#so example.com/index.php#media最容易，其中index.php是容器网站。

如果你想要你可以重写url服务器端以摆脱index.php然后你得到/ media（使用html5历史api内置到现代的任何东西）

＃example位于

之下

$('#ajax-media').click(function(){
    event.preventDefault();
    $('#solution-wrapper').fadeOut('slow', function(){
      $('#solution-wrapper').load('../solution-media.php', function(){

   $(this).fadeIn('slow');
   window.location.hash = 'media'; // This is the line that gives you the #
      });
    });
  });

让我知道这是否有意义

如果您希望能够粘贴网址并在此处加载该部分，那就大致了解如何做到这一点（在我的脑海中）

$(document).ready(function() {
var section = window.location.hash;

if (section) {
$('#ajax-'+section).trigger('click')
}

});

Ajax动态导航

1 个答案: