select的onchange事件

我们用Select的onchange事件时,常会遇到这样一个问题,那就是连续选相同一项时,触发onchange事件.select的onchange事件就是这样子的.你得有Change(改变),才能触发该事件....

掌握了它的特性后,相应的解决办法也很简单.

<select name=sel onchange="bao(this.options[this.options.selectedIndex].value)">
<option value="">请选择
<option value="1">Item 1
<option value="2">Item 2
<option value="3">Item 3
</select>
<script>
function bao(s)
{
    txt.value+=s;
    //选择后,让第一项被选中,这样,就有Change啦.
    document.all.sel.options[0].selected=true;
}
</script>
<textarea id=txt></textarea> 
==================================================================================================

select 或text的onchange事件需要手动(通过键盘输入)改变select或text的值才能触发,如果在js中给select或text赋值,则无法触发onchang事件
例如,在页面加载完成以后,需要触发一个onChange事件,在js中用document.getElementByIdx_x("se").value="ttt";直接给select或text赋值是行的,要想实现手动触发onchange事件,需要在js给select赋值后,加入下面的语句,(假设select的id为sel)
document.getElementByIdx_x("sel").fireEvent('onchange') 来实现,
例子:

<html><body>

<select id="sel" name="test" onchange="demo()">
<option value="1" selected>测试一</option>
  <option value="2">测试二</option>
  <option value="3">测试三</option>
  <option value="4">测试四</option>
</select>
 <input id="tex" type="text" name="text1" id="text1">

<script>

document.getElementByIdx_x("sel").value="3";
document.getElementByIdx_x("sel").fireEvent("onchange");
function demo()
{
var d=document.getElementByIdx_x("sel").value;
document.getElementByIdx_x("tex").value=d;
//alert(d);

}
</script>
</body></html>

上面的代码产生的效果就相当于鼠标在select元素上进行了选择,模仿出了select的onchange效果

 

该文转自:http://cache.baiducontent.com/c?m=9f65cb4a8c8507ed4fece7631046893b4c4380147d8c8c4668d4e419ce3b4c413037bfa6663f405a8e906b6075a5495de9f03c733d0123b598cd8f4997ac925f75ce786a6459db0144dc0edfc15151cb37912aa8f847b0ebb62592dec5a3d54323cb44737e97808c4d0065dd1ff0034193b19838022f16ad9e34728f5c605a9e3441c61aa5f7331e56dba581091bd42ba07660e4b844b02962c404d068&p=8b2a971491d900fb01bd9b7e0b1c83&newp=8773c64ad48506b908e29478070ac1231610db2151ddd315399385&user=baidu&fm=sc&query=%B8%F8select%B8%B3%D6%B5%2C%B2%BB%B4%A6%B7%A3onchange%CA%C2%BC%FE&qid=&p1=3

posted on 2013-06-24 09:20  与君同行  阅读(13145)  评论(0编辑  收藏  举报

导航