全国多级联动下拉菜单(原创)

所属分类:输入-选择框

 8256  65  查看评论 (8)
全国多级联动下拉菜单(原创) ie兼容11

使用方法

发布时间:2018-1-11 0:44

基于mobileSelect.js做的全国联动,使用详情请参考

https://github.com/onlyhom/mobileSelect.js/blob/master/docs/README-CN.md

引入

方式一 标签引入:

<link rel="stylesheet" type="text/css" href="css/mobileSelect.css">
<script src="js/mobileSelect.js" type="text/javascript"></script>

方式二 npm:

npm install mobile-select -D

在你的js文件中import:

import MobileSelect from 'mobile-select'

快速使用

<div id="trigger4"></div>

<script type="text/javascript">
  var mobileSelect4 = new MobileSelect({
      trigger: '#trigger4',
      title: '地区选择-联动',
      wheels: [
                  {data:[
                      {
                          id:'1',
                          value:'附近',
                          childs:[
                              {id:'1',value:'1000米'},
                              {id:'2',value:'2000米'},
                              {id:'3',value:'3000米'},
                              {id:'4',value:'5000米'},
                              {id:'5',value:'10000米'}
                          ]
                      },
                      {id:'2',value:'上城区'},
                      {id:'3',value:'下城区'},
                      {id:'4',value:'江干区'},
                      {id:'5',value:'拱墅区'},
                      {id:'6',value:'西湖区'}
                  ]}
              ],
      position:[0,1],
      callback:function(indexArr, data){
          console.log(data); //返回选中的json数据
      } 
  });
  </script>
相关插件-选择框

jQuery城市下拉选择

jQuery下拉方式选择城市,带搜索、单选、多选。
  选择框
 15158  53

jQuery移动端自定义select插件Ansel

Ansel自定义手机浏览器重置下拉选择带搜索
  选择框
 10502  40

城市选择器,仿猎聘,支持多选,单选

城市选择器,仿猎聘,支持多选,单选
  选择框
 19187  128

城市选择手机端(原创)

类似手机通讯录,选择城市,去除省份。
  选择框
 14170  120

讨论这个项目(8)回答他人问题或分享插件使用方法奖励jQ币

    The lamb of God. 0
    2018/8/11 10:22:13
    可以动态添加吗 回复
    纳兰辰逸 0
    2018/7/27 17:32:23
    需要引入什么js吗
        山/xs魂0
        2018/8/9 9:20:09
        mobileSelect.js就可以
    回复
    qiqi24 0
    2018/7/19 0:14:05
    你这个地区名称是怎么获取到的可以说一下嘛? 回复
    ° 我们不懂 0
    2018/2/27 10:32:13
    可以修改为二级联动吗?
        山/xs魂0
        2018/3/13 9:46:17
        完全可以的,只需要把最后一层childs:干掉就好了。
    回复
    Marryou-you 0
    2018/1/11 11:46:56

    在电脑端时二级地名选取时有bug,鼠标移入就会回到第一个

        山/xs魂0
        2018/1/12 14:33:25

        这个主要是手机端的插件。。。。

    回复
取消回复
  短信接口