<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. ERROR 2013 (HY000): Lost connection to MySQL server at 'waiting for initial communication packet', system error: 2

    ERROR (HY000): Lost connection to MySQL server at 'waiting for initial communication packet', system ...

  2. 微信企业号办公系统-JSSDK上传图片(多图上传)

    在开发微信企业号办公系统中,涉及到了图片上传功能,一开始使用的flash插件上传方法,在苹果手机上可以调用相机直接拍摄照片,但在安卓手机上只能选择照片. 微信jssdk-api带有一套完整的调用选择本 ...

  3. 【C语言】16-预处理指令2-条件编译

    条件编译的概念 在很多情况下,我们希望程序的其中一部分代码只有在满足一定条件时才进行编译,否则不参与编译(只有参与编译的代码最终才能被执行),这就是条件编译. 一.基本用法 1 #if 条件1 2 . ...

  4. 李洪强-C语言7-C语言运算符

    C语言运算符 一.算术运算 C语言一共有34种运算符,包括常见的加减乘除运算. ①. 加法:+ 还可以表示正号 ②. 减法:- 还可以表示负号 ③. 乘法:* 非数学意义上的X ④. 除法:/  注意 ...

  5. [转]Jquery通用开源框架之【ejq.js】

    ejq是一款非常小巧的JS工具库,未压缩才50K,在jquery的基础上对jquery缺失部分作了很好的弥补作用. 优点: 1.具有内置的模板解析引擎语法和angularjs相近减少学习成本 2.能够 ...

  6. Javascript 笔记与总结(2-14)事件

    常用事件: ● onclick 元素点击时 ● onfocus 元素获得焦点时 ● onblur 元素失去焦点时 ● onmouseover 鼠标经过时 ● onsubmit 表单提交时(<fo ...

  7. in_array效率问题以及解决办法

    先将要对比的数组中的 键  和  值  设置成一样 然后用isset() 进行对比,存在则删除

  8. DirectX 基础学习系列5 纹理映射

    1 纹理坐标 类似BMP图像坐标系,左上为原点 纹理坐标为了规范化,范围限定在[0,1]之间,使用纹理的时候,需要修改顶点结构 struct ColorVetex { float x, y,z; fl ...

  9. 【IOS笔记】Creating Custom Content View Controllers

    Creating Custom Content View Controllers 自定义内容视图控制器 Custom content view controllers are the heart of ...

  10. S5PV210裸板驱动:启动

    以往2440和6410的启动方式,只要我们把裸板代码烧写到NAND FLASH的开始位置,当开发板上点启动时,处理器会自动从NAND FLASH上拷贝前面一段的代码到内部的RAM中执行.按照以前的方法 ...