以下是测试代码<!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>
<title></title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/themes/base/jquery-ui.css" type="text/css" media="all" />
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
</head>
<body>
<input type="text" value="" onfocus="$(this).datepicker();" />
<br />
为什么这里点击的时候,第一次没有效果,要第二次才会出现 日期选择框,
<br />
我用FireBug看到,当第一次onfocus的时候,jquery.ui.datepicker是对这个对像进行初始为为:
<br />
<input id="dp1297446258847" class="hasDatepicker" onfocus="$(this).datepicker();" type="text" value="" />
<br />
还有就是添加上了“ui-datepicker-div”这个DIV
<br />
那如何更改
<input type="text" value="" onfocus="$(this).datepicker();" />
<br />
这行代码可以第一次onfocus的时候就显示出日期对话框
<br />
谢谢
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/themes/base/jquery-ui.css" type="text/css" media="all" />
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
</head>
<body>
<input type="text" value="" onfocus="$(this).datepicker();" />
<br />
为什么这里点击的时候,第一次没有效果,要第二次才会出现 日期选择框,
<br />
我用FireBug看到,当第一次onfocus的时候,jquery.ui.datepicker是对这个对像进行初始为为:
<br />
<input id="dp1297446258847" class="hasDatepicker" onfocus="$(this).datepicker();" type="text" value="" />
<br />
还有就是添加上了“ui-datepicker-div”这个DIV
<br />
那如何更改
<input type="text" value="" onfocus="$(this).datepicker();" />
<br />
这行代码可以第一次onfocus的时候就显示出日期对话框
<br />
谢谢
</body>
</html>
不然你换个日期控件吧 my97不错
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/themes/base/jquery-ui.css" type="text/css" media="all" />
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
$(function(){
$("#datepicker").datepicker();
})
//-->
</SCRIPT>
</head>
<body>
<input id="datepicker" type="text" value="" />
<br />
为什么这里点击的时候,第一次没有效果,要第二次才会出现 日期选择框,
<br />
我用FireBug看到,当第一次onfocus的时候,jquery.ui.datepicker是对这个对像进行初始为为:
<br />
<input id="dp1297446258847" class="hasDatepicker" onfocus="$(this).datepicker();" type="text" value="" />
<br />
还有就是添加上了“ui-datepicker-div”这个DIV
<br />
那如何更改
<input type="text" value="" onfocus="$(this).datepicker();" />
<br />
这行代码可以第一次onfocus的时候就显示出日期对话框
<br />
谢谢
</body>
</html>
---------------
$("#datepicker").datepicker();
这种写法我知道,
但是现在我要的写法是在onfocus里面出来的
因为我Ajax一段html给div的时候如果有日期控件我就都得再写上
如:
#("#divMain").html(MyAjax("a.htm"));//ajax一段HTML
$("#divMain.datepicker").datepicker();
这样很麻烦我得判断是否有日期控件
所以我要用
<input type="text" value="" onfocus="$(this).datepicker();" />
这种方式的话上面的js代码就不用管是否ajax过来的html是否有日期谢谢
<!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>
<title></title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/themes/base/jquery-ui.css" type="text/css" media="all" />
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
$(function(){
$(".dpk").datepicker();
})
//-->
</SCRIPT>
</head>
<body>
<input class="dpk" type="text" value="" />
<input type="text" value="" />
<input class="dpk" type="text" value="" />
<br />
</body>
</html>
--------------
我的问题是:
<input type="text" value="" onfocus="$(this).datepicker();" />
这一段HTML是我ajax过来动态添加的
如果这样ajax过来在FF中要点击两次才会出datepicker
但如果是ajax过来
<input type="text" value="" class="dtp" />
的话我就得再写上:
$("#divMain .dtp").datepicker();
但我ajax过来的html不一定会一定就有日期选择框,所以每次都要加上那句代码不现实
如:#("#divMain").html('<input type="text" value="" class="dtp" />');//这段HTML为ajax过来,可能会有日期选择也可能会没有
$("#divMain.datepicker").datepicker();//然后每一次ajax后我都得再加上这一句
//所以我就想写成<input type="text" value="" onfocus="$(this).datepicker();" />
//但这样在ff中就要点击第二次才出现,怎么解决谢谢
问题就在要动态判断input是否为日期控件.还好jquery有live方法:
live(type, [data], fn)
说明:
jQuery 给所有匹配的元素附加一个事件处理函数,即使这个元素是以后再添加进来的也有效。这样对后面添加来控件也有效了<!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>
<title></title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/themes/base/jquery-ui.css" type="text/css" media="all" />
<link rel="stylesheet" href="http://static.jquery.com/ui/css/demo-docs-theme/ui.theme.css" type="text/css" media="all" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/jquery-ui.min.js" type="text/javascript"></script>
<script src="http://jquery-ui.googlecode.com/svn/tags/latest/external/jquery.bgiframe-2.1.2.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.8/i18n/jquery-ui-i18n.min.js" type="text/javascript"></script>
<SCRIPT LANGUAGE="JavaScript">
<!--
$(function(){
// 当鼠标移到input上时给这个input添加日期控件
// 理论上用户鼠标点击事件是不可能发生在移动事件之前的
// 所以在移动事件前添加..
$(".dpk").live("mousemove",function(e){
$(this).datepicker();
});
})
function add(){
$("body").append('<input class="dpk" type="text" value="" />');
}
//-->
</SCRIPT>
</head>
<body>
<input class="dpk" type="text" value="" />
<input type="text" value="" />
<input class="dpk" type="text" value="" />
<br />
<button onclick="add()">add</button>
</body>
</html>