TextBox中, javascript (DatePicker)改变Text内容, 触发OnTextChanged事件失效的问题的处理方式

文章标签: javascript
2014-12-18 13:15:16     28 人阅读    


想过Ajax, 我就这一个地方用, 一来是觉得浪费, 二来看到有评论说, AjaxPro和DataPicker一起用会报错.
 
有个帖子的回复, 茅塞顿开
原帖:
========================

asp.net textbox的ontextchange事件不能触发
<asp:TextBox ID="time" runat="server" Onclick="new CbsCalendar(this.id)" 
                    Width ="88%" AutoPostBack="true" ontextchanged="time_TextChanged"  ></asp:TextBox>
onclick事件是显示一个日历,然后textbox中日期变更以后不会触发time_textchanged事件

 
回答1:
ontextchanged要在textbox处于焦点状态后改变其内容在失去焦点才调用。

回到你的情况中:电击文本框(或取得焦点)---弹出日历并选择日期(此时焦点移chu文本框,但文本框内容未发生变化)---通过js改变文本框的内容(值为:选择的日期)
回答2:
TextBox控件会被Render成 html 中的 inpu type="text" 控件, 其 AutoPostBack 是通过 input 的DOM事件 onchange 来实现的。以下是 .net 3.5 中 TextBox 生成的 html:
       

<input name="TextBox1" type="text" onchange="javascript:setTimeout('__doPostBack(\'TextBox1\',\'\')', 0)" onkeypress="if (WebForm_TextBoxKeyHandler(event) == false) return false;" id="TextBox1" />


而客户端事件 onchange 只在手动修改文本框的值后才会触发,用脚本修改值并不触发该事件。而你用的日历控件恰恰是通过 javascript 脚本来给文件框设置值的,所以不会有 onchange 事件触发,也就不会回发页面。 变通的实现方法是在日历控件的脚本中设置完文本框的值后调用下文本框的onchange,简单的可以通过 document.getElementById(textbox_id).onchange(); 实现, textbox_id即你传给 new CbsCalendar() 的参数也就是文本框的客户端id。
 
------最简单的解决方法, 去找My 97 , DatePicker.js, 在最后一个方法function meizzDayClick(n,ex){...}末尾, 添加一个onchange();即可, 例如:      
 if (outObject.onchange)
        outObject.onchange();
 
然后就能触发OnTextChanged事件了
 
 
============================
 

js给textbox赋值触发onchange事件的方法 来源:http://www.greensoftcode.net/

 

 js中onchange事件是在客户端改变输入控件的值,比如一个textbox,会出发的一个事件。但是如果在js代码中改变一个textbox的value,而不是通过键盘输入改变一个textbox值的话,是不会出发onchange事件的。
那么,如何在js代码模式通过代码触发textbox控件的onchange事件呢,经过查阅资料,发现js提供了一个方法,可以触发控件的应该是所有事件。object.fireEvent()方法,使用方法如 object.fireEvent('onchange'),即可触发控件的onchange事件。
同理,js中使用fireEvent方法还可以触发其他的空间事件。
补充一下,上述的fireEvent方法,在firefox浏览器并不支持,那么,如果想在ie和ff都可以运行的话,可是尝试下面的代码。
i

f (obj.fireEvent)
{
obj.fireEvent('onchange');
}
else
{
obj.onchange();
}
例子 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);
  
  }


原文地址:http://www.itmmd.com/201412/339.html
该文章由 萌萌的IT人 整理发布,转载须标明出处。

Java程序设计经典300例 实现不同字符串的连接   上一篇
下一篇  Linq 无法删除尚未附加的实体的问题

精彩回复
发表评论
姓名:       

《程序员app》专门为程序员量身定做!