<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<script type="text/javascript">
function selValue(){
document.getElementById("divValue").style.display = "block";
}
function closeDiv(isSave){
if(isSave){
var result = [];
var chk = document.getElementsByName("chk");
for(var i=0; i<chk.length; i++){
if(chk[i].checked)
result.push(chk[i].value);
}
document.getElementById("txt").value = result.join(",");
}
document.getElementById("divValue").style.display = "none";
}
</script>
</head>
<body>
<div>
测试: <input type="text" id="txt" name="txt" /> <a href="javascript:selValue();">选值</a>
<div id="divValue" style="display:none;position:absolute; 200px; height:130px; border:1px solid #006699; background:#F5F6FB; padding:5px; line-height:22px;">
<input type="checkbox" id="chk1" name="chk" value="1" />1<br />
<input type="checkbox" id="chk2" name="chk" value="2" />2<br />
<input type="checkbox" id="chk3" name="chk" value="3" />3<br />
<input type="checkbox" id="chk4" name="chk" value="4" />4<br />
<input type="checkbox" id="chk5" name="chk" value="5" />5<br />
<a href="javascript:closeDiv(true);">确定</a>
<a href="javascript:closeDiv(false)">取消</a>
</div>
</div>
</body>
</html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<META content="fason,阿信" name=Author>
<title>动态提示的下拉框</title>
<style>
a{color:red;text-decoration:none;font-size:12px}
</style>
</head>
<body onload="Init()">
<form name=frm>
<table>
<tr>
<td>
<input name="txt" style="100px" onkeyup="SelectTip()">
<input type="button" value="reset" onclick="Init()"><br/>
以此字串开始<input type="radio" name="sflag" onclick="sflg(0)" checked>
以此字串结束<input type="radio" name="sflag" onclick="sflg(1)">
包含此字串<input type="radio" name="sflag" onclick="sflg(2)">
不包含此字串<input type="radio" name="sflag" onclick="sflg(3)">
</td>
</tr>
<tr>
<td>
<span id="demo1">
<select name="demo" style="100px" size=10 sFlag=0 onchange="txt.value=options[selectedIndex].text;">
</select>
</span>
</td>
</tr>
</form>
</table>
<script language="javascript">
var SelectOptions=[
["1","1"],
["12","12"],
["123","123"],
["1234","1234"],
["2","2"],
["22","22"],
["223","223"],
["2234","2234"],
["3","3"],
["32","32"],
["323","323"],
["3234","3234"],
["4","4"],
["42","42"],
["423","423"],
["4234","4234"],
["5","5"],
["51","51"],
["51w","51w"],
["51wi","51wi"],
["51win","51win"],
["51wind","51wind"],
["51windowns","51windows"]
];//存贮option
/* 初始化选择框 */
function Init()
{
var TxtObj=document.frm.elements["txt"]
TxtObj.value="";
var SelectObj=document.frm.elements["demo"]
SelectObj.innerText="";
for(i=0;i<SelectOptions.length;i++)
{
var aElement=document.createElement("OPTION");
SelectObj.appendChild(aElement);
aElement.value = SelectOptions[i][0];
aElement.innerText = SelectOptions[i][1];
}
}
function sflg(n){
var SelectObj=document.frm.elements["demo"]
SelectObj.sFlag = n;
SelectTip();
}
function SelectTip(){
var TxtObj=document.frm.elements["txt"]
if (TxtObj.value.length==0) return;
var SelectObj=document.frm.elements["demo"]
SelectObj.innerText="";
for(i=0;i<SelectOptions.length;i++)
{
if (SelectObj.sFlag==0 && SelectOptions[i][1].indexOf(TxtObj.value)!=0) continue; //以此字串开始;
if (SelectObj.sFlag==1 && (SelectOptions[i][1].length < TxtObj.value.length || SelectOptions[i][1].indexOf(TxtObj.value)!=(SelectOptions[i][1].length-TxtObj.value.length))) continue; //以此字串结束;
if (SelectObj.sFlag==2 && SelectOptions[i][1].indexOf(TxtObj.value)==-1) continue; //包含此字串;
if (SelectObj.sFlag==3 && SelectOptions[i][1].indexOf(TxtObj.value)!=-1) continue; //不包含此字串;
var aElement=document.createElement("OPTION");
SelectObj.appendChild(aElement);
aElement.value = SelectOptions[i][0];
aElement.innerText = SelectOptions[i][1];
}
}
</script>
</body>
<html>
<head>
<SCRIPT type="text/javascript">
function filterlist(selectobj) {
this.selectobj = selectobj;
this.optionscopy = new Array();
for (var i=0; i < selectobj.options.length; i++) {
this.optionscopy[i] = new Option();
this.optionscopy[i].text = selectobj.options[i].text;
this.optionscopy[i].value = selectobj.options[i].value;
}
this.reset = function() {
this.set("");
}
this.set = function(pattern) {
var loop=0, index=0, regexp, e;
this.selectobj.options.length = 0;
try {
regexp = new RegExp(pattern, "i");
} catch(e) {
return;
}
for (loop=0; loop < this.optionscopy.length; loop++) {
if (regexp.test(this.optionscopy[loop].text)) {
this.selectobj.options.length = index + 1;
this.selectobj.options[index].text = this.optionscopy[loop].text;
this.selectobj.options[index].value = this.optionscopy[loop].value;
this.selectobj.options[index].selected = false;
index++;
}
}
}
}
</SCRIPT>
</head>
<body>
<FORM name="myform" action="">
<SELECT size=5 name=myselect>
<OPTION>VeryAsp
<OPTION>Laurence Fishburne
<OPTION>Monica Bellucci
<OPTION>Daniel Bernhardt
<OPTION>Nona Gaye
<OPTION>Lachy Hulme
<OPTION>Nathaniel Lees
<OPTION>Harry J. Lennix
<OPTION>Matt McColm
<OPTION>Carrie-Anne Moss
<OPTION>Collin Chou
<OPTION>Genevieve O'Reilly
<OPTION>Harold Perrineau Jr.
<OPTION>Jada Pinkett Smith
<OPTION>Adrian Rayment
<OPTION>Neil Rayment
<OPTION>Bruce Spence
<OPTION>Hugo Weaving
<OPTION>Lambert Wilson
<OPTION>Anthony Wong
<OPTION>Walter O'Riley
<OPTION>Zach Taylor
<OPTION>Yuri Andropov
<OPTION>Xavier
<OPTION>Tom Selleck
<OPTION>Heather Graham
<OPTION>Ursula Andrews
<OPTION>Victoria Jackson
<OPTION>Vivian Vance
<OPTION>Star Jones
<OPTION>Steve McQueen</OPTION>
</SELECT>
<SCRIPT type=text/javascript>
var myfilter = new filterlist(document.myform.myselect);
</SCRIPT>
<P>Filter by regular expression:<BR><INPUT onkeyup=myfilter.set(this.value) name=regexp></p>
</FORM>
</body>
</html>