你的位置:首页 > Java教程

[Java教程]jQuery省市区三级联动插件


体验效果:http://hovertree.com/texiao/bootstrap/4/
支持PC和手机移动端.


代码如下:

<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="x-ua-compatible" content="ie=edge"><meta name="viewport" content="width=device-width, initial-scale=1"><title>:jQuery省市区三级联动插件city-picker</title><base target="_blank" /><!--可无视--><link href="http://hovertree.com/texiao/bootstrap/4/css/main.css" rel="stylesheet" type="text/css" /><!--必要样式--><link href="http://hovertree.com/ziyuan/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" /><link href="http://hovertree.com/texiao/bootstrap/4/css/city-picker.css" rel="stylesheet" type="text/css" /></head><body><!-- Content --><div class="container"><h2 class="page-header">演示</h2><div class="docs-methods"><form class="form-inline"><div id="distpicker"><div class="form-group"><div style="position: relative;"><input id="city-picker3" class="form-control" readonly type="text" value="江苏省/常州市/溧阳市" data-toggle="city-picker"></div></div><div class="form-group"><button class="btn btn-warning" id="reset" type="button">重置</button><button class="btn btn-danger" id="destroy" type="button">确定</button></div></div></form></div></div><div class="container"><a href="http://hovertree.com">首页</a> <a href="http://hovertree.com/texiao/">特效</a> <a href="http://hovertree.com/h/bjaf/5gbv36dt.htm">原文</a> <a href="http://hovertree.com/texiao/jquery/22/">效果2</a> </div><script src="http://hovertree.com/ziyuan/jquery/jquery-1.12.1.min.js"></script><script src="http://hovertree.com/ziyuan/bootstrap/3.3.6/js/bootstrap.min.js"></script><script src="http://hovertree.com/texiao/bootstrap/4/js/city-picker.data.js"></script><script src="http://hovertree.com/texiao/bootstrap/4/js/city-picker.js"></script><script src="http://hovertree.com/texiao/bootstrap/4/js/main.js"></script></body></html>

数据来源:http://hovertree.com/h/bjae/vm6plijj.htm

转自:http://hovertree.com/h/bjaf/5gbv36dt.htm

更多特效:http://www.cnblogs.com/roucheng/p/texiao.html