日期:2014-05-16  浏览次数:20426 次

求解:脚本控制select的下拉列表的自动展开
第一种方法(这种方法在IE上能实现,但会提示警告信息):
1、首先将焦点给Select
2、然后模拟按键Alt+↓。模拟按键是使用ActiveX控件来完成的。

第二种方法:
1、改变select框的高度
<select size="1" name="D1" id="test1">
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>
<input type="button" value="提交" name="B1" onclick="if(test1.size==1){test1.size=test1.length} else{test1.size=1}">

而我需要的效果是同select本身的下拉箭头单击时一样,虽然第一种方法效果不错,但不兼容其他浏览器啊。

求高手!!!


------解决方案--------------------
用其他元素模拟一个select控件,然后你想怎么控制就怎么控制了
------解决方案--------------------
弄一个输入框
输入框下面跟一个select组件: 
组件要足够的size展示你所有的选项
组件要用绝对布局,动态获取上头那个输入框的X和Y,来决定它的位置
控制这个select的style.display来显示和隐藏它

以前写过的代码片段:

<select id="selectmenu" ondblclick="onselect()" style="background-color: gray;"></select>
vspan.style.display = "block";
vspan.style.top = vlisten.offsetTop + vlisten.offsetHeight;
vspan.style.left = vlisten.offsetLeft; //事件X坐标
vselect.innerHTML = "";
vselect.size = result.length > 20 ? 20 : result.length;

for (i = 0;i < result.length - 1; i++){
var child = document.createElement("option");
child.setAttribute("value",result[i]);
child.innerHTML = result[i];
vselect.appendChild(child);
}

------解决方案--------------------
探讨

var select = document.getElementById('test11');
fireEvent(select, 'onclick');
function fireEvent(node, eventName) {
if (document.all &amp;&amp; !document.addEventListener) {
ele.fire……