以前在另一个博客上写的,打算把家安在优快云,所以,就转过来了:)
------------------------------------------------
昨天哥们给推荐了一个老外写的下拉列表控件,vbs写的,浏览了下,觉得不错。
哥们说:可不可以翻成js版本。
仔细看了下源代码,与其照猫画虎不如自己搞。
首先确定需求。
明确需求后,就开工了:)
下拉时,数据列表的显示,我选择了popup窗口,原因就是:支持跨窗口,显示优先级高
正在编程时,才发现,脚本操作popup窗口有个关键性的难点,就是其对事件、样式等编程实现时,需要全文写入窗体内部。
对窗体事件的处理,与朋友交流后,她采用了js的对象自定义方法:
实现代码:
var opopup=window.createPopup();
var opopupBody=opopup.document.body;
opopupBody.οnkeydοwn=opopup_onkeydown;
function opopup_onkeydown()
{
alert("OK");
}
var html="<div tabIndex=''0'' οnmοuseοver=''f(event)''>ssm1226</div>";
opopupBody.innerHTML=html;
以上代码,基本上实现了对popup窗体onkeydown事件的响应及处理。
其中有个比较特殊的属性:tabIndex
起初并未加入该属性,但发现,响应onkeydown事件的永远是body而非意料中的div
关键原因是:
msdn中有这么一段关于tabIndex属性的说明:
An element can have focus if the tabIndex property is set to any valid negative or positive integer.
The following elements can have focus and are tab stops by default: a, BODY, button, frame, iframe, img, input, isIndex, object, select, textArea.
The following elements can have focus by default but are not tab stops. These elements can be set as tab stops by setting the tabIndex property to a positive integer. applet, div, frameSet, span, table, td.
Setting the tHead and tFoot elements to participate in the tab order will not cause the focus rectangle to display when either receives focus.