<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. 记在thinkPHP中一个创建模型的小错误

    在创建好模型以后,访问说没有该方法,如图 看代码 class ManagerModel { //put your code here function checkDenglu($name,$pwd){ ...

  2. kail-linux 安全之旅

    一些学习网站 http://xiao106347.blog.163.com/blog/static/2159920782013111995945233/ http://xiao106347.blog. ...

  3. windows batch语法

    windows BATCH基本知识扩展名是bat(在nt/2000/xp/2003下也可以是cmd)的文件就是批处理文件. ==== 注 =============================== ...

  4. 【iCore2 双核心板视频教程一】iM_LAN 100M 以太网模块UDP例程(包含视频教程)

    ============================== 技术论坛:http://www.eeschool.org 博客地址:http://xiaomagee.cnblogs.com 官方网店:h ...

  5. 【iCore、iCore2、iBoard例程】【异步FIFO跨时钟域通信(通过ARM 读FPGA FIFO)】

    欢迎访问电子工程师学堂,以便了解更多内容:http://www.eeschool.org 一.本实验基于iCore2 完成,通过简单改动,即可用在 iCore 核心板.iBoard 电子学堂上. iC ...

  6. CodeForces 621C 数学概率期望计算

    昨天训练赛的题..比划了好久才想出来什么意思 之前想的是暴力for循环求出来然后储存数组 后来又想了想 自己萌的可以.. 思路就是求出来每个人与他的右边的人在一起能拿钱的概率(V(或)的关系)然后*2 ...

  7. {转自MC}NVIDIA DirectX 11演示DEMO详解

    http://tieba.baidu.com/p/1960826986 图形技术无论如何发展,最终都要落到实际的应用中才有效果.在个人电脑上,图形技术最大的用户除了显示UI和操作界面外,就是呈现美轮美 ...

  8. PHP 错误与异常 笔记与总结(8)自定义错误处理函数 set_error_handler()

    通过 Set_error_handler() 函数设置用户自定义的错误处理函数. 步骤: ① 创建错误处理函数 ② 设置不同级别调用函数 ③ Set_error_handler() 函数制定接管错误处 ...

  9. php调用empty出现错误Can't use function return value in write context

    php调用empty出现错误Can't use function return value in write context 2012-10-28 09:33:22 | 11391次阅读 | 评论:0 ...

  10. 僵尸传染bfs

    #include<stdio.h> int map[4][4]={0,0,0,1,       0,0,1,1,       0,0,1,0,       0,1,0,0}; int mx ...