1.在使用input页面加载script的引用

<script src="js/distpicker/distpicker.data.js"></script>
<script src="js/distpicker/distpicker.js"></script>

注意:必须使用jquery

<script src="js/jquery-3.2.0.min.js"></script>

Html结构:<div data-toggle="distpicker" class="clearfix down">

    <div class="form-group">
        <select class="form-control"  id="province1"></select>
    </div>
    <div class="form-group">
        <select class="form-control"  id="city1"></select>
    </div>
</div>

2.若想获取省市的传递值

在html页面加入一个:

<input name="competition_area" type="hidden" value="" id="competition_area">

在js加上:

var select = $(".form-control").find("option:selected").text();
var o = document.getElementById("competition_area");
o.value = select;

在form表单提交时就会提交上

$('#form').serialize()

competition_area= “”

省际联动distpicker插件的使用讲解的更多相关文章

  1. 中国省市区地址三级联动jQuery插件 案例下载

    中国省市区地址三级联动jQuery插件 案例下载 distpicker 是一款可以实现中国省市区地址三级联动jQuery插件.它使用简单,简单设置即可完成中国省市区地址联动效果. 安装 可以通过npm ...

  2. 省市区地址三级联动jQuery插件Distpicker使用

    插件下载地址 http://www.jq22.com/jquery-info8054 效果如下: 使用: 1.引入js <script src="http://www.jq22.com ...

  3. jQuery Distpicker插件 省市区三级联动 动态赋值修改地址

    在获取创建页面数据后需要在编辑页面调取之前提交的数据,在使用这个插件后发现无法动态赋值,查找资料后发现需要先销毁实例,$(’#target’).distpicker(‘destroy’); 第一步 引 ...

  4. 移动端省际联动插件mobiscroll

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

  5. 4个好用的JS联动选择插件

    jQuery City Select 一个简单的jQuery省市联动插件,可以自定义JSON字典实现其他内容的联动选择菜单. PCAS省.市.地区联动选择JS封装类 PCAS可能是国内使用人数最多的J ...

  6. v-distpicker 一个好用的三级联动的插件

    // 引入插件npm install v-distpicker --save import VDistpicker from 'v-distpicker' Vue.component('v-distp ...

  7. vue 引用省市区三级联动(插件)

    vue 用省市区三级联动之傻瓜式教程(复制粘贴即用) npm 下载 npm install v-distpicker --save main.js //引入 省市区三级联动 import Distpi ...

  8. 关于jQuery插件imgAreaSelect基础讲解

    关于ImgAreaSelect,  是一jQuery插件,它支持用户通过鼠标拖曳选择图片的一部分,如图片拖曳.图片编辑等~~来具体看一下 1.先下载imgAreaSelect插件 下载地址: 英文:h ...

  9. jQuery插件ImgAreaSelect 实例讲解一(头像上传预览和裁剪功能)

    上一节随笔中,我们已经知道了关于jQuery插件ImgAreaSelect基本的知识:那么现在看一下实例: 首先,要知道我们应该实现什么功能? (1)图片能够实现上传预览功能 (2)拖拽裁剪图片,使其 ...

随机推荐

  1. 利用redis的bitmap实现用户签到功能

    一.场景需求 适用场景如签到送积分.签到领取奖励等,大致需求如下: 比如签到1天送1积分,连续签到2天送2积分,3天送3积分,3天以上均送3积分等. 如果连续签到中断,则重置计数,每月初重置计数. 显 ...

  2. Android Scroller简单用法 --View滚动

    转:http://ipjmc.iteye.com/blog/1615828 Android里Scroller类是为了实现View平滑滚动的一个Helper类.通常在自定义的View时使用,在View中 ...

  3. error C2712: Cannot use __try in functions that require object unwinding

    转自VC错误:http://www.vcerror.com/?p=52 问题描述: error C2712: Cannot use __try in functions that require ob ...

  4. NYOJ 119 士兵杀敌(三)【ST算法】 分类: Brush Mode 2014-11-13 20:56 101人阅读 评论(0) 收藏

    题目链接:http://acm.nyist.net/JudgeOnline/problem.php?pid=119 解题思路: RMQ算法. 不会的可以去看看我总结的RMQ算法. http://blo ...

  5. 靖烜小哥哥之mybatis总结

    MyBatis是一个半自动映射的框架.“半自动”是相对于Hibernate全表映射而言的,MyBatis需要手动匹配提供POJO.SQL和映射关系,而Hibernate只需提供POJO和映射关系即可. ...

  6. Markdown使用语法

    一.标题 一级标题为#号后加空格再加标题内容 二级标题为两个 # 号后加空格再加标题内容 以此类推,支持六级标题 二.字体 1. 加粗 在需要加粗的文字两侧分别用两个 * 包起来 2.斜体 在需要倾斜 ...

  7. Idea 2018.2.5创建springboot项目依赖包没有的错误

  8. Eclipse Unable to install breakpoint in XXX 解决办法

    Debug 时偶尔会出现:Eclipse Unable to install breakpoint in XXX 情况一: 清除所有断点就行了,原因是断点打到注释上了. breakpoint 窗口: ...

  9. 通过ID获取元素 注:获取的元素是一个对象,如想对元素进行操作,我们要通过它的属性或方法。

    通过ID获取元素 学过HTML/CSS样式,都知道,网页由标签将信息组织起来,而标签的id属性值是唯一的,就像是每人有一个身份证号一样,只要通过身份证号就可以找到相对应的人.那么在网页中,我们通过id ...

  10. idea-----idea的项目中output框出现乱码

    找到tomcat的安装目录中的logging.properties 我的在这里:E:\tools\tomcat\apache-tomcat-8.5.38\conf 改其中的参数 修改前  java.u ...