使用layui左侧菜单点击跳转后变成选中状态

我们在开发后台时候，会选择使用layui，为我们大大提供了方便，当我们点击左侧菜单时候，会变成选中状态

这是layui系统默认提供给我们的，但是当我们给菜单项里添加了 URL后就没这么顺利了，我们点击后，页面会重新刷新，刷新后选中状态就没有了，当然，可以考虑使用iframe，但是iframe使用起来总是不那么灵活，通过调试台我们可以看到，选中状态其实就是父级标签多了一个class属性

这样的话，问题就好解决了，上js代码。

    /**
     * 假如当前 Url 是 http// www. liangshunet.
     * com/pub/item.aspx?t=osw7，则截取到的相对路径为：/pub/item.aspx。
     *
     * @returns
     */
    function GetUrlRelativePath() {
        var url = document.location.toString();
        var arrUrl = url.split("//");

        var start = arrUrl[1].indexOf("/");
        var relUrl = arrUrl[1].substring(start);// stop省略，截取从start开始到结尾的所有字符

        if (relUrl.indexOf("?") != -1) {
            relUrl = relUrl.split("?")[0];
        }
        return relUrl;
    }

    /**
     * 选中菜单默认打开
     * @returns
     */
    $(document).ready(function() {
        var url = GetUrlRelativePath();
        var patt1 = new RegExp(url);
        //$(".layui-this").removeClass();
        $(document.body).find('a').each(function(i, obj) {
            var str = $(obj).attr('href');
            if (patt1.test(str)) {
                $(obj).parent().addClass("layui-this");
            }
        });
    });

我相信这个代码一点都不难，细心点都可以看懂，使用时记得要引入jQuery相关文件。