事件冒泡和事件捕获
0
悬赏园豆：10
[待解决问题]
这个要怎么实现点击下拉列表以外的地方执行隐藏下拉列表，而且是一个页面中有多个这个的都能实现？
所有回答(2)
1
给document.body注册一个click事件，隐藏所有下拉列表。
然后给下拉列表部分注册一个click事件，用e.stopPropagation()方法阻止事件冒泡，这样事件就不会传递到body引发它的click事件了。
0
给每个下拉列表控件，当失去焦点 就隐藏下拉列表内容。下拉表控件获得焦点，显示下拉列表内容。
我的代码是这样子的：
1 <li class="city"> 2 <button class="bt citySelect" value=""> 3 <span>请选择城市</span> 4 <img src="{{StaticServer}}/staticv2/images/country/select-dropdown.png" alt=""/> 5 </button> 6 <ul class="cityList"> 7 {% for city in guider_info.GuiderCity|split_list:"," %} 8 {% if city %} 9 <li class="select">{{city}}</li> 10 {% endif %} 11 {% endfor %} 12 </ul> 13 <span class="error">还未选择城市</span> 14 </li>
这样可以监听焦点吗？
@liuhuigoing: 我不写前台具体代码我也不懂。我写VC用到下拉列表都是这么个思想处理的。
附：在网上看到的一个省市联动的例子 js代码【我大体能看懂】
var lmcount; var lmcount2; lm=new Array(); lm2=new Array(); lm[0]=new Array("北京辖区","北京市"); lm[1]=new Array("北京辖县","北京市"); …… lm2[3142]=new Array("图木舒克市","新疆省辖单位"); lm2[3143]=new Array("五家渠市","新疆省辖单位"); lmcount=345;//全国市的数目 lmcount2=3144;//全国县的数目 //定义函数：用于联动省 和 市 两级----- city为市级下拉框的id名， pro为省下拉框的id 号。 用法：onChange="changepro('省id名','市id名');"/////// //////////// function changepro(city,pro) { var city=city; var pro=document.getElementById(pro).value; var i; document.getElementById(city).length=1; for (i=0;i<lmcount;i++){ if (lm[i][1]==pro){ document.getElementById(city).options[document.getElementById(city).length]=new Option(lm[i][0], lm[i][0]); } } } //定义函数：用于联动市 和 县 两级---- -county 为县级下拉框的id名， city为市下拉框的id 号。 用法：onChange="changecity('市id名','县id名');"/////// //////////// function changecity(county,city) { var county=county; var city=document.getElementById(city).value; var j; document.getElementById(county).length=1; for (j=0;j<lmcount2;j++){ if (lm2[j][1]==city){ document.getElementById(county).options[document.getElementById(county).length]=new Option(lm2[j][0], lm2[j][0]); } } } // JavaScript Document
