日历控件导致textbox的onblur事件和TextChanged事件不执行
我在网页里放了个textbox,
<asp:TextBox ID="txtSdate" runat="server" onclick="SelectDate(this.name)" AutoPostBack="True" ontextchanged="txtSdate_TextChanged" OnBlur="refreshclick()" ></asp:TextBox>
用SelectDate(this.name)调用下面的js,来达到日历控件的目的,我想在选定日期后自动去刷新页面,也就是调用
ontextchanged="txtSdate_TextChanged",但是这样的效果是,不行将鼠标点在textbox里然后敲一下回车才能刷新
我又加了OnBlur="refreshclick()" ,选好日期后,在textbox外点一下鼠标,onblur事件同样不执行。
我看了下js文件,发现他是生成的div,也就是说选好日期后,txtSdate的Text并没有变,所以ontextchanged事件不执行吗?
有没有办法实现选点日期后自动调用ontextchanged或者OnBlur事件呢?
下面是生成日历的js文件,麻烦高手帮忙看看,谢谢!
var cal;
var isFocus=false;
function SelectDate(o,p,strFormat)
{
var date = new Date();
//alert(date);
var by = date.getFullYear() - 50;
// alert(by);
var ey = date.getFullYear() + 50;
// alert(ey);
var obj = document.getElementById(o);
// alert(o);
cal = (cal == null) ? new Calendar(by, ey, 0) : cal;
// alert(cal);
if(arguments.length > 2&&strFormat!=null)
{
cal.dateFormatStyle = strFormat;
// alert(strFormat);
// alert(cal.dateFormatStyle);
}
if(arguments.length == 1)
{
cal.show(obj);
// alert(obj);
}
else
{
var pop = document.getElementById(p);
cal.show(obj, pop);
// alert(pop);
}
}
String.prototype.toDate = function (style) {
var y = this.substring(style.indexOf('y'), style.lastIndexOf('y') + 1);
var m = this.substring(style.indexOf('M'), style.lastIndexOf('M') + 1);
var d = this.substring(style.indexOf('d'), style.lastIndexOf('d') + 1);
if (isNaN(y)) y = new Date().getFullYear();
if (isNaN(m)) m = new Date().getMonth();
if (isNaN(d)) d = new Date().getDate();
var dt;
eval("dt = new Date('" + y + "', '" + (m - 1) + "','" + d + "')");
return dt;
// alert(dt);
}
Date.prototype.format = function(style) {
var o = {
"M+" : this.getMonth() + 1,
"d+" : this.getDate(),
"h+" : this.getHours(),
"m+" : this.getMinutes(),
"s+" : this.getSeconds(),
"w+" : "天一二三四五六".charAt(this.getDay()),
"q+" : Math.floor((this.getMonth() + 3) / 3),
"S" : this.getMilliseconds()
}
if(/(y+)/.test(style)) {
style = style.replace(RegExp.$1,
(this.getFullYear() + "").substr(4 - RegExp.$1.length));
}
for(var k in o){
if(new RegExp("("+ k +")").test(style)){
style = style.replace(RegExp.$1,
RegExp.$1.length == 1 ? o[k] :
("00" + o[k]).substr(("" + o[k]).length));
}
}
return style;
};
function Calendar(beginYear, endYear, lang, dateFormatStyle) {
this.beginYear = 1990;
this.endYear = 2010;
this.lang = 0;
this.dateFormatStyle = "yyyy-MM-dd";
if (beginYear != null && endYear != null){
this.beginYear = beginYear;
this.endYear = endYear;
}
if (lang != null){
this.lang = lang
}
if (dateFormatStyle != null){
this.dateFormatStyle = dateFormatStyle
}
this.dateControl = null;
this.panel = this.getElementById("calendarPanel");
this.container = this.getElementById("ContainerPanel");
this.form = null;
this.date = new Date();
this.year = this.date.getFullYear();
this.month = this.date.getMonth();
// alert(this.month);
this.colors = {
"cur_word" : "#FFFFFF",
"cur_bg" : "lightsteelblue",
"sel_bg" : "#FFCCCC",
"sun_word" : "#FF0000",
"sat_word" : "green",
"td_word_light" : "#333333",
"td_word_dark" : "#CCCCCC",
"td_bg_out" : "#EFEFEF",
"td_bg_over" : "#FFCC00",
"tr_word" : "#FFFFFF",
"tr_bg" : "steelblue",
"input_border" : "#CCCCCC",
"input_bg" : "white"
}
this.draw();
this.bindYear();
this.bindMonth();
this.changeSelect();
this.bindData();
}
Calendar.language = {
"year" : [[""], [""]],
"months" : [["一月","二月","三月","四月","五月","六月","七月","八月","九月","十月","十一月","十二月"],
["JAN","FEB","MAR","APR","MAY","JUN","JUL","AUG","SEP","OCT","NOV","DEC"]
],
"weeks" : [["日","一","二","三","四","五","六"],
["SUN","MON","TUR","WED","THU","FRI","SAT"]
],
"clear" : [["清空"], ["CLS"]],
"today" : [["今天"], ["TODAY"]],
"close" : [["关闭"], ["CLOSE"]]
}
[解决办法]
//示例:非使用模板页<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="TestTree.aspx.cs" Inherits="WebApplication1.TestTree" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"> <title></title> <script src="jquery-1.4.1.js" type="text/javascript"></script> <script src="calendar.js" type="text/javascript"></script> <script type="text/javascript"> var calendar; var text1; var calendarTable; function TextBox1_Changed(targetElement) { alert(targetElement); } $(document).ready(function () { text1 = $("#<%=TextBox1.ClientID%>")[0]; calendar = new Calendar(0, 2012, 1); $(text1).focus(function () { calendar.show(text1); }) calendarTable = $("#calendarTable")[0]; $(calendarTable.all).each(function (k, v) { if (v.tagName.toLowerCase() == "td") { $(v).click(function (eventArgs) { TextBox1_Changed(text1); }) } }); }); </script></head><body> <form id="form1" runat="server"> <div id="panelTree" runat="server" class="Tree"> </div> <input type="text" onfocus="TextBox1_Changed(this);" id="TextBox1" runat="server"/>//此处绑定的onfocus有效 但onchange、onblur无效。//经测试,在javascipt中通过TextBox.value=""这种修改不会触发onchange事件。 </form></body></html>