<link href="assets/css/mobiscroll.custom-2.17.0.min.css" rel="stylesheet" type="text/css" />

<script src="assets/js/mobiscroll.custom-2.17.0.min.js" type="text/javascript"></script>

//html

<ol class="treelist-sex" id="menusex">
                <li>男</li>
                <li>女</li>
            </ol>

<select id="demo" class="all_width ">
            <optgroup label="济南">
                <option value="1">历下区</option>
                <option value="2">市中区</option>
                <option value="3">天桥区</option>
                <option value="4" selected="selected">历城区</option>
            </optgroup>

<optgroup label="滨州">
                <option value="15">滨城区</option>
                <option value="16">西海区</option>
            </optgroup>
        </select>

//js

$('.treebutton-sex').click(function() {
                    $('.treelist-sex').mobiscroll('show');
                    return false;
                });
                $(".treelist-sex").mobiscroll().treelist({
                    theme: "mobiscroll",
                    display: 'bottom',
                    lang: "zh",
                });

// js 地址选择控件(可显示多行)
                $('#city-picker').click(function() {
                    $('#demo').mobiscroll('show');
                    return false;
                });
$('#demo').mobiscroll().select({
    theme: 'mobiscroll',
    display: 'bottom',
    label: 'City',
    lang: "zh",
    group: true,
    groupLabel: 'Country',

//不允许右侧控制左侧

group: {
    clustered: true
}
    //选择表单展现的样式
    inputClass:"all_width text-right clear_border"
//  fixedWidth: [100, 170]
});

移动端省际联动插件mobiscroll的更多相关文章

  1. 移动端的日期插件 mobiscroll 2.14.4 破解版

    官方报价695美元 http://mobiscroll.com/pricing 这个 mobiscroll 2.14.4 破解版 包括datetime和calendar组件,包括mobiscroll和 ...

  2. jQuery省市区三级联动插件

    体验效果:http://hovertree.com/texiao/bootstrap/4/支持PC和手机移动端. 手机扫描二维码体验效果: 代码如下: <!DOCTYPE html> &l ...

  3. 纯原生js移动端城市选择插件

    接着上一篇纯js移动端日期选择插件,话说今天同事又来咨询省市县联动的效果在移动端中如何实现,还是老样子,百度上一搜,诶~又全是基于jquery.zepto的,更加可恨的是大多数都是PC版的,三个sel ...

  4. 基于zepto的移动端轻量级日期插件

    前言 做过移动Web开发的同学都知道,移动端日期选择是很常见的需求.在PC端,我们有很丰富的选择,比较出名的就有Mobiscroll和jQuery UI Datepicker.个人看来,这些插件存在的 ...

  5. 项目一:第九天 1、前台客户登录 2、Jquery citypicker省市区三级联动插件 4、业务受理(在线下单)

    1. 前台客户登录 2. Jquery citypicker省市区三级联动插件 3. 百度地图介绍 4. 业务受理(在线下单) 1 实现前台系统登录功能 1.1 Md5加密 admin(明文)---- ...

  6. (转)JQM 日期插件 mobiscroll Demo

    (原)http://www.wglong.com/main/artical!details?id=11  JQM 日期插件 mobiscroll Demo 2013-04-25 / 分类:Jquery ...

  7. (转)jQuery Mobile 移动开发中的日期插件Mobiscroll 2.3 使用说明

    (原)http://www.cnblogs.com/hxling/archive/2012/12/12/2814207.html jQuery Mobile 移动开发中的日期插件Mobiscroll ...

  8. 移动端触摸滑动插件Swiper

    移动端触摸滑动插件Swiper 04/02/2015 一.了解Swiper 目前移动端项目一般都需要具有触屏焦点图的效果,如果你也需要实现这一功能的话,Swiper是一个不错的选择. 1.他不需要加载 ...

  9. jQuery日期联动插件

    此版本为网上的日期联动插件修改版,加入了修改后事件 /* * jQuery Date Selector Plugin * 日期联动选择插件 * * Demo: $("#calendar&qu ...

随机推荐

  1. myeclipse 8.5最新注册码

    myeclipse 8.5最新注册码(过期时间到2016年) Subscriber:huazai          Subscription Code:uLR8ZC-855550-6156585630 ...

  2. 移动web app开发小贴士 收藏有用

    1 创建主屏幕图标 (Creating a home screen icon ,for ios)   1 2 3 4 5 6 //57*57 <link rel="apple-touc ...

  3. 全屏滚动-jQuery插件实现

    全屏滚动 <---很久没写了,这段忙了点,以后还是每周尽量写点东西---> 在很多情况下,我们需要页面的全屏滚动,尤其是移动端.今天简要的介绍一下全屏滚动的知识. 一.全屏滚动的原理 1. ...

  4. RestSharp用法小结

    今天有空,小结一下RestSharp的用法. RestSharp内置了XML和JSON的反序列化(deserializers ). application/json – JsonDeserialize ...

  5. [转]Net 下采用GET/POST/SOAP方式动态调用WebService C#实现

    本文转自:http://www.cnblogs.com/splendidme/archive/2011/10/05/2199501.html 一直以来,我们都为动态调用WebService方法而烦恼. ...

  6. Unattend.xml应答文件制作(WISM)-- 转自爱做梦的鱼

    将制作好的应答文件unattend.xml拷贝到模板机sysprep目录下,然后在cmd下运行(unattend.xml文件可自定义名称)   sysprep /generalize /oobe /s ...

  7. 获取文本文件的第N行内容

    在PowerShell中,可以通过Get-Content这个cmdlet来获取文本文件的内容.Get-Content将一个文本文件读取到一个数组中,每一个数组元素就是文件的一行内容.比如一个文本文件内 ...

  8. 被spring和hibernate4逼疯

    spring3.1整合hibernate4,事务都配置上了的,但getCurrentSession()仍然获得不到 以下是各配置 web.xml ? 1 2 3 4 5 6 7 8 9 10 11 1 ...

  9. Solve one floodlight install problem

    参考: Floodlight安装 SDNLAB Floodlight官网 Installation Guide 问题: 在follow安装教程安装Floodlight的过程中,ant编译时出现了: [ ...

  10. Javascript 笔记与总结(1-5)闭包

    [例1] <script> function t1(){ var age = 20; function t2(){ alert(age); } return t2; } var tmp = ...