mobiscroll手機端日期控件二級聯動菜單選擇代碼



82 325 109



特效描述:mobiscroll 手機端日期控件 二級聯動 菜單選擇代碼,mobiscroll類似日期一樣的js,可自行編輯滑動內容

代碼結構

1. 引入CSS

<link href="style/mobiscroll.2.13.2.css" rel="stylesheet" />

2. 引入JS

<script src="script/jquery-1.9.1.js"></script>
<script src="script/mobiscroll.2.13.2.js"></script>

3. HTML代碼

    <div class="header">
        <h1><a href="javascript:location.reload(true);">Mobiscroll 2.13.2</a></h1>
    </div>
    <div class="content">
       <div class="settings">
			<label for="demo1">日期-年</label>
			<input id="demo1" placeholder="請選擇出生年月" />  
			<label for="demo2">日期-年月</label>
			<input id="demo2" placeholder="請選擇出生年月" />  
			<label for="demo3">日期-年月日</label>
			<input id="demo3" placeholder="請選擇出生年月" />  
        </div>        
        <div data-role="fieldcontain" class="demo-select">
            <label for="city">普通下拉-選擇城市</label>
            <select id="city" class="demo-test-select" data-role="none">
                <option value="1">北京</option>
                <option value="2">波士頓</option>
                <option value="3">芝加哥</option>
                <option value="4">倫敦</option>
                <option value="5">洛杉磯</option>
                <option value="6">紐約</option>
                <option value="7">巴黎</option>
                <option value="8">舊金山</option>
            </select>
        </div>
        <div data-role="fieldcontain" class="demo-select-opt">
            <label for="names">級聯下拉-高分電影</label>
            <select id="names" class="demo-test-select-opt" data-role="none">
                <optgroup label="喜劇片">
                    <option value="0">《瘋狂的石頭》</option>
                    <option value="1">《夜店》</option>
                    <option value="2">《讓子彈飛》</option>
                    <option value="3">《非誠勿擾》</option>
                </optgroup>
                <optgroup label="驚悚片">
                    <option value="78">《電鋸驚魂》</option>
                    <option value="79">《死神來了》</option>
                    <option value="80">《驚聲尖叫》</option>
                    <option value="81">《致命彎道》</option>
                    <option value="82">《異次元殺陣》</option>
                    <option value="83">《生化危機》</option>
                    <option value="84">《異形》</option>
                </optgroup>
                <optgroup label="青春片">
                    <option value="118">《關于莉莉周的一切》</option>
                    <option value="119">《東邪西毒》</option>
                    <option value="120">《天使愛美麗》</option>
                    <option value="121">《可愛的骨頭》</option>
                    <option value="122">《猜火車》</option>
                </optgroup>
                <optgroup label="科幻片">
                    <option value="195">《我是傳奇》</option>
                    <option value="196">《機械公敵》</option>
                    <option value="197">《蜘蛛俠》</option>
                    <option value="198">《鋼鐵俠》</option>
                    <option value="199">《變形金剛》</option>
                    <option value="200">《X戰警》</option>
                    <option value="201">《哈利波特》</option>
                </optgroup>
                <optgroup label="劇情片">
                    <option value="261">《殺死比爾》</option>
                    <option value="262">《暴力街區》</option>
                    <option value="263">《2012》</option>
                    <option value="264">《流感》</option>
                    <option value="265">《告白》</option>
                    <option value="266">《無間道》</option>
                    <option value="267">《門徒》</option>
                </optgroup>
            </select>
        </div>
    </div>



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


熱門標簽: 拖動 拖拽 拖動插件 拖拽插件 切換按鈕 日期時間 時鐘 日歷 時間 日歷插件 時間日期插件 表單 表單美化 表單插件 表單美化插件 文字拖動 文字拖拽 時間日期插件 時間日期 按鈕控制
?
×
×

注冊

官方QQ群

掃描上面二維碼加微信群

官方QQ群

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

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

老夫子电子