Js 下拉框新建窗口

2012-08-10 01:08 youxin 阅读(324) 评论(0) 编辑收藏举报

<body>
<form id="aform">
<select id="mymenu" size="1">
<option value="nothing" selected="selected">Select a site</option>
<option value="http://www.dynamicdrive.com">Dynamic Drive</option>
<option value="http://www.codingforums.com">Coding Forums</option>
<option value="http://www.cssdrive.com">CSS Drive</option>
</select>
</form>
 <script type="text/javascript">
var selectmenu=document.getElementById("mymenu");
selectmenu.onchange=function(){ //run some code when "onchange" event fires
 var chosenoption=this.options[this.selectedIndex];//this refers to "selectmenu"
 if (chosenoption.value!="nothing"){
  window.open(chosenoption.value, "", ""); //open target site (based on option's value attr) in new window
 }
};
</script>
</body>

Form SELECT elements (<select>) within your form can be accessed and manipulated in JavaScript via the corresponding Select object. To access a SELECT element in JavaScript, use the syntax:

document.myform.selectname //where myform and selectname are names of your form/element.
document.myform.elements[i] //where i is the position of the select element within form
document.getElementById("selectid") //where "selectid" is the ID of the SELECT element on the page

Then, the options[] property of SELECT returns as a HTMLCollection every OPTION, for example:

document.getElementById("myselect").options[0] //accesses first option via options[]
document.getElementById("myselect").options[3] //accesses 4th option via options[]

Finally, each individual OPTION within SELECT is represented in JavaScript as a corresponding option object. This gives you access to an OPTION's actual value or text, among other things. For example:

document.getElementById("myselect").options[0].value //accesses value attribute of 1st option
document.getElementById("myselect").options[3].text //accesses text of 1st option

In summary, there is the select object in JavaScript to access a SELECT element, select.options[] property that contains each individual OPTION as a HTMLCollection, and finally, theoption object that represents each OPTION itself in JavaScript.

参考：

http://www.javascriptkit.com/jsref/select.shtml

刷新页面返回顶部

登录后才能查看或发表评论，立即登录或者逛逛博客园首页

有心故我在

Js 下拉框新建窗口

About

最新评论

c++

Java

web

随笔分类

php

Python