jQuery移動端四級聯動世界地區選擇代碼



194 773 258



特效描述:jQuery移動端 四級聯動 世界地區選擇,

代碼結構

1. 引入CSS

<link rel="stylesheet" href="css/[email protected]@hash"/>
<link rel="stylesheet" href="css/demo.css"/>

2. 引入JS

<script src="js/ydui.flexible.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/ydui.citys.js"></script>
<script src="js/ydui.js"></script>

3. HTML代碼

<section class="g-flexview">
    <section class="g-scrollview">
        <div class="m-celltitle">默認調用</div>
        <div class="m-cell">
            <div class="cell-item">
                <div class="cell-left">所在地區:</div>
                <div class="cell-right cell-arrow">
                    <input type="text" class="cell-input" readonly id="J_Address" value="" placeholder="請選擇收貨地址">
                </div>
            </div>
        </div>
        <div class="m-celltitle">設置默認值</div>
        <div class="m-cell">
            <div class="cell-item">
                <div class="cell-left">所在地區:</div>
                <div class="cell-right cell-arrow">
                    <input type="text" class="cell-input" readonly id="J_Address2" value="中國 新疆維吾爾自治區 烏魯木齊市 天山區" placeholder="請選擇收貨地址">
                </div>
            </div>
        </div>
    </section>
</section>
<script>
    /**
     * 默認調用
     */
    !function () {
        var $target = $('#J_Address');
        $target.citySelect();
        $target.on('click', function (event) {
            event.stopPropagation();
            $target.citySelect('open');
        });
        $target.on('done.ydui.cityselect', function (ret) {
        	console.log(ret)
            $(this).val(ret.country + ' ' + ret.provance + ' ' + ret.city + ' ' + ret.area);
        });
    }();
    /**
     * 設置默認值
     */
    !function () {
        var $target = $('#J_Address2');
        $target.citySelect({
        	country: '中國',
            provance: '新疆維吾爾自治區',
            city: '烏魯木齊市',
            area: '天山區',
            id: '1-31-330-3033'
        });
        $target.on('click', function (event) {
            event.stopPropagation();
            $target.citySelect('open');
        });
        $target.on('done.ydui.cityselect', function (ret) {
        	console.log(ret);
            $(this).val(ret.country + ' ' + ret.provance + ' ' + ret.city + ' ' + ret.area);
        });
    }();
</script>



用戶評論
大牛,別默默的看了,快登錄幫我點評一下吧!:)      登錄 | 注冊


熱門標簽: 滾動切換 滾動條切換 滑動選項卡 滑動切換 彈出層拖動 選項卡切換 選項卡 切換 tab切換 頁面切換 選項卡插件 切換插件 滑動手風琴 窗口 彈出 彈窗 彈出層 提示框 對話框 遮罩 遮罩層 彈窗插件 切換按鈕 表單 表單美化 表單插件 表單美化插件 提示框/彈出層 文字切換 文字選項卡 選項卡自動切換 三級聯動 城市選擇 城市選擇器
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

jQuery/js討論群
群號:642649996
Css3+Html5討論群
群號:322131262

加群請備注:從官網了解到

湖北30选5开奖结果走势图表