jquery仿京东商城三级联动代码插件
模仿京东送货地址省市县3级联动,已经做成jQuery插件形式,效果图如下
jquery仿京东商城三级联动代码插件DEMO
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery仿京东商城三级联动代码插件</title> <link type="text/css" rel="stylesheet" href="css.css" /> </head> <body> <!--注意选DOM结构不要随便更改,可能会导致出错--> <ul class="list1"> <li class="summary-stock"> <div class="dt">配 送 至:</div> <div class="dd"> <div class="addrID"><div></div><b></b></div> <div class="store-selector"> <div class="text"><div></div><b></b></div> <div onclick="$(this).parent().removeClass('hover')" class="close"></div> </div> </div> </li> </ul> <br /> <br /> <ul class="list1" style="margin-top:100px"> <li class="summary-stock"> <div class="dt">配 送 至:</div> <div class="dd"> <div class="addrID"><div></div><b></b></div> <div class="store-selector"> <div class="text"><div></div><b></b></div> <div onclick="$(this).parent().removeClass('hover')" class="close"></div> </div> </div> </li> </ul> </body></html> <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.9.1.min.js"></script> <script src="location.js"></script> <script> //如果初始化为其他地区的,需要注意选择器的修改,传递不同的proid(省id),cityid:(市id) areaid:(县id),省市对应ID在location.js里面有定义,县id从京东动态加载 $('ul.list1').Address({ proid: 20, cityid: 1726, areaid: 22885 }); </script>
完整压缩包下载地址:jquery仿京东商城三级联动代码插件
加支付宝好友偷能量挖...
原创文章,转载请注明出处:jquery仿京东商城三级联动代码插件