js脚本

解析提取url中的查询字符串参数

// 解析提取url中的查询字符串参数
function decodeQuery () {
    var search = decodeURI(document.location.search);
    return search.replace(/(^\?)/, '').split('&').reduce(function (result, item) {
        values = item.split('=');
        result[ values[ 0 ] ] = values[ 1 ];
        return result;
    }, {});
}
$(document).ready(function () {
    house_id = decodeQuery()[ 'id' ]
    $.get("/api/v1.0/house/" + house_id,

滚动轮播图Swiper

// 设置幻灯片对象，开启幻灯片滚动
                var mySwiper = new Swiper('.swiper-container', {
                    loop: true,
                    autoplay: 2000,
                    autoplayDisableOnInteraction: false,
                    pagination: '.swiper-pagination',
                    paginationClickable: true
                });

 <script src="/static/plugins/swiper/js/swiper.jquery.min.js"></script>
        <div class="swiper-container">
            <div class="swiper-wrapper">
                <!-- <div class="swiper-slide">
                    <a href="/detail.html?id=1"><img src="/static/images/home01.jpg"></a>
                    <div class="slide-title">房屋标题1</div>
                </div>
                <div class="swiper-slide">
                    <a href="/detail.html?id=2"><img src="/static/images/home02.jpg"></a>
                    <div class="slide-title">房屋标题2</div>
                </div>
                <div class="swiper-slide">
                    <a href="/detail.html?id=3"><img src="/static/images/home03.jpg"></a>
                    <div class="slide-title">房屋标题3</div>
                </div> -->
            </div>
            <script type="text/html" id="swiper-houses-tmpl">
                {{ each houses as house }}
                <div class="swiper-slide">
                    <a href="/detail.html?id={{ house.id }}"><img src="{{ house.index_image_url }}"></a>
                    <div class="slide-title">{{ house.title }}</div>
                </div>
                {{ /each }}
            </script>
            <div class="swiper-pagination"></div>
        </div>
<script src="/static/plugins/swiper/js/swiper.jquery.min.js"></script>
<script src="/static/js/template.js"></script>

页面滚动加载

var house_data_querying = true;  // 是否正在向后台发送数据


// 在页面添加好城区选项信息后，更新展示房屋列表信息
            updateHouseData("renew");
            // 获取页面显示窗口的高度
            var windowHeight = $(window).height();
            // 为窗口的滚动添加事件函数
            window.onscroll = function () {
                // var a = document.documentElement.scrollTop==0? document.body.clientHeight : document.documentElement.clientHeight;
                var b = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
                var c = document.documentElement.scrollTop == 0 ? document.body.scrollHeight : document.documentElement.scrollHeight;
                // 如果滚动到接近窗口底部
                if (c - b < windowHeight + 50) {
                    // 如果没有正在向后端发送查询房屋列表信息的请求
                    if (!house_data_querying) {
                        // 将正在向后端查询房屋列表信息的标志设置为真，
                        house_data_querying = true;
                        // 如果当前页面数还没到达总页数
                        if (cur_page < total_page) {
                            // 将要查询的页数设置为当前页数加1
                            next_page = cur_page + 1;
                            // 向后端发送请求，查询下一页房屋数据
                            updateHouseData();
                        } else {
                            house_data_querying = false;
                        }
                    }
                }
            }

解析url中的查询字符串

/** 解析url中的查询字符串 */
function decodeQuery () {
    var search = decodeURI(document.location.search);
    return search.replace(/(^\?)/, '').split('&').reduce(function (result, item) {
        values = item.split('=');
        result[ values[ 0 ] ] = values[ 1 ];
        return result;
    }, {});
}

更新日期展示数据

/** 更新日期展示数据 */
function updateFilterDateDisplay () {
    var startDate = $("#start-date").val();
    var endDate = $("#end-date").val();
    var $filterDateTitle = $(".filter-title-bar>.filter-title").eq(0).children("span").eq(0);
    if (startDate) {
        var text = startDate.substr(5) + "/" + endDate.substr(5);
        $filterDateTitle.html(text);
    } else {
        $filterDateTitle.html("入住日期");
    }
}

拼接url参数

path = /user/login
params = {
	a:"b",
	c:"d"
}
return  " /user/login?a=b&c=d"    

    buildUrl: function (path, params) {
        var url = "" + path;
        var _paramUrl = "";
        if (params) {
            // params = {
            //     a:"b",
            //     c:"d"
            // }
            // "a=b&c=d"
            _paramUrl = Object.keys(params).map(function (k) {
                return [encodeURIComponent(k), encodeURIComponent(params[k])].join("=");
            }).join("&");
            _paramUrl = "?" + _paramUrl;
        }
        return url + _paramUrl;
    },