Php 无序列表-列表项位置

目前，我有一个5页的网站，主导航正在使用无序列表显示。我试图实现的是在列表中首先显示“活动”页面

例如，如果我在这些页面上有一个标题：“主页|关于|联系|博客”。当你在“联系人”页面上时，这应该会移到列表的顶部，因此菜单会像这样：“联系人|主页|关于|博客”

引起我问题的是，菜单是通过php包含的，所以所有页面只有一个菜单，我通过php创建了它，以便它向当前页面菜单项添加一个“活动”类

我真的不确定这方面的最佳解决方案是什么，我真的非常感谢任何帮助

编辑：

这是包含在每个页面中的导航页面：

            <nav class="large-nav">
              <ul>
                <li <?php echo ($activePage == 'ourStory') ? "class='active'" : ""; ?> ><a href="our_story.php" title="">OUR STORY</a></li>
                <li <?php echo ($activePage == 'services') ? "class='active'" : ""; ?> ><a href="services.php" title="">SERVICES</a></li>
                <li <?php echo ($activePage == 'projects') ? "class='active'" : ""; ?> ><a href="projects.php" title="">PROJECTS</a></li>
                <li <?php echo ($activePage == 'contact') ? "class='active'" : ""; ?> ><a href="contact.php" title="">CONTACT</a></li>
                <li <?php echo ($activePage == 'upload') ? "class='active'" : ""; ?> ><a style="margin-right: 0;" href="upload.php#top" title="">UPLOAD</a></li>
              </ul>
            </nav>

jQuery:

$(function(){
    $("li").on("click", function(){
        $('ul').prepend($(this))
    }) 
})

HTML

<ul>
    <li>Home</li>
    <li>Contact</li>
    <li>About</li>
    <li>Blog</li>
</ul>


家
接触
关于
博客


jQuery:

$(function(){
    $("li").on("click", function(){
        $('ul').prepend($(this))
    }) 
})

HTML

<ul>
    <li>Home</li>
    <li>Contact</li>
    <li>About</li>
    <li>Blog</li>
</ul>


家
接触
关于
博客

您可以这样做：

$('.large-nav li').each(function() { 
    if($(this).find('a').attr('href') == location)
    {
        $('.large-nav ul').prepend($(this))
    }
})

你可以这样做：

$('.large-nav li').each(function() { 
    if($(this).find('a').attr('href') == location)
    {
        $('.large-nav ul').prepend($(this))
    }
})

下面是一个使用Flexbox排序的纯CSS方法


演示：

支持：IE10+、Firefox、Chrome
这里有一个纯CSS的方法，可以使用Flexbox进行排序


演示：

支持：IE10+、Firefox、Chrome这些属性是否存储在无序列表中？你能不能把你的活动页面放在无序列表的正上方，我是说最上面的索引？你为什么不发布添加“活动”类的代码？为了回答您的问题，修改会更容易。对不起，我添加了包含的导航页面。这些属性是否存储在无序列表中？你能不能把你的活动页面放在无序列表的正上方，我是说最上面的索引？你为什么不发布添加“活动”类的代码？为了回答您的问题，修改会更容易。对不起，我添加了包含的导航页面。我需要那个页面是什么意思？是的，更简单；我记得当我第一次理解
append（）/prepend（）
的真正功能时，我非常惊讶，所以你可以不用任何帮助就完成这项工作。你到底想要什么？？如果您真的认为包含的PHP文件不能从jQuery更改，那么这不是一个好主意。当PHP第一次包含页面和活动类时，现在您必须通过jQuery控制功能，就像排序完成一样。我不是op dude。顺便说一句，你的回答帮不了他，因为页面被重新加载了（我想里面没有Ajax调用）。。。很抱歉我误解了。你说我需要那个是什么意思？是的，更简单；我记得当我第一次理解
append（）/prepend（）
的真正功能时，我非常惊讶，所以你可以不用任何帮助就完成这项工作。你到底想要什么？？如果您真的认为包含的PHP文件不能从jQuery更改，那么这不是一个好主意。当PHP第一次包含页面和活动类时，现在您必须通过jQuery控制功能，就像排序完成一样。我不是op dude。顺便说一句，你的回答帮不了他，因为页面被重新加载了（我想里面没有Ajax调用）。。。很抱歉我误解了。为什么要将其与位置进行比较？为什么不使用hasClass（'active'）？如果不修改location对象，此代码将无法工作。我尝试过，它可以工作。。。但是您也可以使用
hasClass（'active'）
。。我不认为有什么区别。当你引用位置时，你是在使用全局位置对象吗？@Edward yup Indeedth你不是在比较字符串和对象吗？您不需要location.pathname吗？为什么要将其与location进行比较？为什么不使用hasClass（'active'）？如果不修改location对象，此代码将无法工作。我尝试过，它可以工作。。。但是您也可以使用
hasClass（'active'）
。。我不认为有什么区别。当你引用位置时，你是在使用全局位置对象吗？@Edward yup Indeedth你不是在比较字符串和对象吗？你不想要location.pathname吗？