js 代码实现onchange事件

select 或text的onchange事件需要手动(通过键盘输入)改变select或text的值才能触发,如果在js中给select或text赋值,则无法触发onchang事件,
例如,在页面加载完成以后,需要触发一个onChange事件,在js中用document.getElementById("se").value="ttt";直接给select或text赋值是不行的,要想实现手动触发onchange事件,需要在js给select赋值后,加入下面的语句,(假设select的id为sel)
document.getElementById("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.getElementById(
" sel " ).value = " 3 " ;
  document.getElementById(
" sel " ).fireEvent( " onchange " );
  
function  demo()
  {
   
var  d = document.getElementById( " sel " ).value;
   document.getElementById(
" tex " ).value = d;
   
// alert(d);
  
  }
  
</ script >
    
</ body ></ html >

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


------------------------------------------------------------------------------------------------------------------------------------------------------

js中onchange事件是在客户端改变输入控件的值,比如一个textbox,会出发的一个事件。但是如果在js代码中改变一个textbox的value,而不是通过键盘输入改变一个textbox值的话,是不会出发onchange事件的。

那么,如何在js代码模式通过代码触发textbox控件的onchange事件呢,经过查阅资料,发现js提供了一个方法,可以触发控件的应该是所有事件。object.fireEvent()方法,使用方法如 object.fireEvent('onchange'),即可触发控件的onchange事件。

同理,js中使用fireEvent方法还可以触发其他的空间事件。

  • 补充一下,上述的fireEvent方法,在firefox浏览器并不支持,那么,如果想在ie和ff都可以运行的话,可是尝试下面的代码。
    if (obj.fireEvent)
    {
    obj.fireEvent('onchange');
    }
    else
    {
    obj.onchange();
    }

    也就是判断一下fireEvent事件是否可用,不可用则直接使用onchange()方法。

  • OnTextChanged事件;当textbox失去焦点时触发,但是当是用js给textbox赋值时(比如点击textbox,触发js事件给textbox赋值),textbox的值虽然改变,但并不会触发OnTextChanged事件。
  • 解决方法:在js事件中给textbox赋值后,加上这一段:this.form1.submit();(form1是form的ID)


  • 2
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值