js修改url刷新页面

来源：互联网发布：王宝强离婚知乎编辑：程序博客网时间：2024/05/18 03:57
/**圈子分类*/<div class="fr">                    <h3>圈子分类：</h3>                    <ul class="ul_lv1 js_flyout_list" data-flyout_sel="ul_lv2">/**全部*/                        <li class="li_lv1">                            <a class="J_Ajax a_lv1 active" href="javascript:;" data-module="category"                               data-key="categoryPrimaryId" data-value="">全部</a>                        </li>/**一级分类*/                        <c:forEach items="${category}" var="item">                            <li class="li_lv1">                                <a class="J_Ajax a_lv1" href="javascript:;" data-module="category"                                   data-key="categoryPrimaryId"                                   data-value="${item.category.enumId}">${item.category.enumName}</a>                                <ul class="ul_lv2">                                    <li class="li_lv2">                                        <a class="J_Ajax a_lv2" href="javascript:;" data-module="category"                                           data-key="categoryPrimaryId" data-value="${item.category.enumId}">全部</a>                                    </li>/**二级分类*/                                    <c:forEach items="${item.secCategory}" var="sec_item">                                        <li class="li_lv2">                                            <a class="J_Ajax a_lv2" href="javascript:;" data-module="category"                                               data-key="categorySecondaryId"                                               data-value="${sec_item.enumId}">${sec_item.enumName}</a>                                        </li>                                    </c:forEach>                                </ul>                            </li>                        </c:forEach>                    </ul>                    <div class="clear"></div></div>-------------------------------------------------------------------------------------------------------------------------/**排序*/<div class="l">                <ul class="tab_btns">                    <li class="J_Ajax active down" data-module="sort" data-key="sort" data-value="CREATE_TIME desc">                        <a href="javascript:;">时间</a>                    </li>                    <li class="J_Ajax down" data-module="sort" data-key="sort" data-value="USER_COUNT desc">                        <a href="javascript:;">圈友数</a>                    </li>                    <li class="J_Ajax down" data-module="sort" data-key="sort" data-value="ACTIVITY_COUNT desc">                        <a href="javascript:;">活动数</a>                    </li>                    <li class="J_Ajax down" data-module="sort" data-key="sort" data-value="TOPIC_COUNT desc">                        <a href="javascript:;">发布数</a>                    </li>                </ul></div>-------------------------------------------------------------------------------------------------------------------------/**图片模式和列表模式*/<div class="r">                <div class="list_view_switch">                    <a href="javascript:;" class="J_Ajax pic_view" data-module="style" data-key="style"                       data-value="grid">图片模式</a>                    <a href="javascript:;" class="J_Ajax list_view active" data-module="style" data-key="style"                       data-value="list">列表模式</a>                </div>                <!-- START pagi_mini -->                <jsp:include page="/WEB-INF/pages/common/pagination_mini.jsp" flush="true">                    <jsp:param name="paginationObjectName" value="circle"/>                </jsp:include>                <!-- END pagi_mini --></div>-------------------------------------------------------------------------------------------------------------------------/**默认为列表模式*/<c:choose>            <c:when test="${param.style == 'grid'}"> /**图片模式*/                <div class="pic_view">                    <div class="list_padding">                    </div>                </div>            </c:when>            <c:otherwise>    /**列表模式*/                <!-- START list_view -->                <div class="list_view">                    <div class="list_padding">                                            </div>                </div>                <!-- END list_view -->            </c:otherwise></c:choose>-------------------------------------------------------------------------------------------------------------------------categoryPrimaryId 一级分类   sort 排序  style：风格（列表和网格）  page：分页url:未过滤之前：http://dev.com/sns/circle/listCircle全部(默认一级分类，创建时间排序，第一页，风格为list)：http://dev.com/sns/circle/listCircle?categoryPrimaryId=&sort=CREATE_TIME%20desc&style=list&page=1点击二级分类：http://dev.com/sns/circle/listCircle?categorySecondaryId=51&sort=CREATE_TIME%20desc&style=list&page=1网格显示：http://dev.com/sns/circle/listCircle?categoryPrimaryId=&sort=CREATE_TIME%20desc&style=grid&page=1圈友数排序http://dev.com/sns/circle/listCircle?categoryPrimaryId=&sort=USER_COUNT%20desc&style=grid&page=1活动数排序http://dev.com/sns/circle/listCircle?categoryPrimaryId=&sort=ACTIVITY_COUNT%20desc&style=grid&page=1-------------------------------------------------------------------------------------------------------------------------/**js操作：修改url参数*/$(function () {    $(".J_Ajax").click(function () {        changeActive($(this));        var module = $(this).attr("data-module");        var path = document.location.origin;        if (!path) {            path = window.location.protocol + "//" + window.location.host;        }        var url = path + document.location.pathname;        var param = "?";        var isFirst = true;        $(".J_Ajax.active").each(function () {            var key = $(this).attr("data-key");            var value = $(this).attr("data-value");            if (module != "page" && module != "style" && key == "page") {                value = 1;            }            if (isFirst) {                isFirst = false;                param += (key + "=" + value);            } else {                param += ("&" + key + "=" + value);            }        });        window.location.href = url + param;    });  });/** * 改变一组module中的选中标签 * @param $this 被选中的对象 */function changeActive($this) {    var module = $this.attr("data-module");    $("[data-module=" + module + "]").removeClass("active");    $this.addClass("active");}
0 0