建议用右键代替双击:
<script>
function show()
{ var a=document.getElementById("div1")
if (event.button==2)
{a.style.display=a.style.display=="none"?"":"none"
}
}
</script>
<select onmousedown="show()">
<option>aaaa</option>
<option>bbb</option>
<option>ccc</option>
<option>dddd</option>
</select>
<div id="div1" style="display:none">
<textarea ></textarea>
</div>
尝试如下代码,在 Friefox 54 及 IE 11 下测试可行
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<input type="checkbox" id="checkbox1" value="跑步"> 跑步
<input type="checkbox" id="checkbox2" value="打球"> 打球
<input type="checkbox" id="checkbox3" value="登山"> 登山
<input type="checkbox" id="checkbox4" value="游泳"> 游泳
<input type="checkbox" id="checkbox5" value="骑车"> 骑车
<div id="div1">
</div>
</body>
<script>
var objdiv = document.getElementById('div1')
for(i=1 i<6 ++i) {
var objchk = document.getElementById('checkbox' + i)
objchk.addEventListener('click', function(e) {
//获取当前正在点击的 Checkbox对象
var objchk = e.target
//获取已生成的 Input 对象
var objipt_exist = document.getElementById('ipt' + objchk.id)
if(objchk.checked) {
//如果 Checkbox 选中状态下对应的 Input 已存在,就返回,以防重复添加Input
if(objipt_exist) {
return
}
//如果文本框不存在,在 div1 容器中动态添加 Input
var objipt = document.createElement('input')
objipt.setAttribute('value', objchk.value)
objipt.setAttribute('id', 'ipt' + objchk.id)
objdiv.appendChild(objipt)
} else {
//从div1中移除已存在的 Input
objdiv.removeChild(objipt_exist)
}
}, false)
}
</script>
</html>
java和javascript这两个不能混为一谈吧 不过可以说说:最常见的方法是,所有的下拉列表的数据都是固定死了的,写到js的数组里,然后用js来实现,这方面的js代码相当多,这就是纯js实现的.如果数据是动态的,需要先组装成list再配合js调用......