<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. 使用freemarker生成word,步骤详解并奉上源代码

    1.   步骤 1.    用word编辑好模板 1. 普通字符串替换为 ${string} 2. 表格循环用标签 <#list userList as user> 姓名:${user.u ...

  2. Excel操作类

    '引入Excel的COM组件 Imports System Imports System.Data Imports System.Configuration Imports System.Web Im ...

  3. 客户端显示Not yet reported

    No.1: IIS, WSUS, 加域的顺序,不过貌似关系不大,按照这个顺序就行了.   No.2: KB2734608, KB2720211的影响,3.2.7600.256 (KB2734608), ...

  4. node系列:琐碎备忘

    cmd 全局与本地路径 查看:默认 查看本地路径:npm config get cache,默认和nodejs安装目录同一目录 查看全局路径:npm config get prefix,默认c盘app ...

  5. 【ZZ】 移位贴图 Displacement Mapping

    http://blog.csdn.net/huazai434/article/details/5650629 说明:该技术需要VS3.0的支持!!! 一,移位贴图类似于地形渲染.不过由于移位纹理可以做 ...

  6. Klayge 引擎的安装

    http://www.klayge.org/wiki/index.php?title=%E4%BE%8B%E5%AD%90%E7%A8%8B%E5%BA%8F&redirect=no& ...

  7. 20145235 学号 《Java程序设计》第2周学习总结

    教材学习内容总结 本周学习教材第三章,本章主要讲述了java语言中的一些基础语法,java是个支持面向对象的程序语言,但在正式进入面向对象支持语法的探讨前,对于类型.变量.运算符.流程控制等,这些各种 ...

  8. space ship

    按下向上箭头,飞船速度不是一直增加 而且飞船移动的方向是固定的不是有角度的 按下箭头飞船可以飞了,但是不减速 加一个keyup handler就可以啦!可以一直加速,不按的时候也可以减速 按下向下按钮 ...

  9. Java保留两位小数的几种做法

    1.  String类型数字始终保留两位小数 , RoundingMode.HALF_UP); return bd.toString(); } /** * 使用DecimalFormat,保留小数点后 ...

  10. ::after,::before使用

    ::after,::before使用   1.:before 选择器在被选元素的内容前面插入内容. 请使用 content 属性来指定要插入的内容. <!DOCTYPE html> < ...