Question

求指导：jquery 动态添加日期控件不起作用？

是这样的，我在JSP页面中直接写一个日期控件时，是可以正常工作的，但是当我动态添加一个时间控件时，则不起作用了。例如，
$(function(){

$(".datepicker").datepicker({dateFormat:"yy-mm-dd",autoSize:true});
$('.datepicker').datepicker('option', $.datepicker.regional['zh-CN']);
$(".datepicker").datepicker('setDate',new Date());
}

$("#addRow").click(function(){

var $tr=$("<tr></tr>");

var $td1=$("<td></td>");
$td1.append("<input type=\"text\" class=\"datepicker\" style=\"width: 70px;\">");
$td1.appendTo($tr);

$tr.appendTo("#tab");

}
有一个addRow按钮，当点击的时候，在表tab中添加一行数据，其中这行中第一个字段为一个日期，用日期控件来实现，但是，这样添加行后，日期这个字段却并没有相应的日期控件，而仅仅只是一个输入框，请问这是什么原因呢？该如何解决？
ps:与日期相关的js文件都已正常导入，如果是直接写在页面中，例如
<input type="text" class="datepicker" style="width: 70px;"> 则日期控件是可以正常工作的。求大神指导！

本人QQ：742511872，真心着急，求指导！分不是问题!只要能解决，额外加分！

Answer 1

你动态添加的input框，并不会被日历控件主动初始化。
因为你再初始化日历控件的时候，页面还没有你添加的这些元素呢。
你只能这样。

$(function(){
$.datepicker.setDefaults($.datepicker.regional['zh-CN']);
function initDatePicker(ele){
ele.datepicker({
dateFormat:"yy-mm-dd",
autoSize:true,
})
initDatePicker($(".datepicker"));

}

$("#addRow").click(function(){

var $tr=$("<tr></tr>");
var $td1=$("<td></td>");
var dateInput = $("<input type=\"text\" class=\"datepicker\" style=\"width: 70px;\">")
$td1.append(dateInput);
$td1.appendTo($tr);
$tr.appendTo("#tab");
initDatePicker(dateInput);

}

)

追问

首先非常感谢您的回答，我按照您的方法试了，也许是我在试的过程中哪里还出了点问题，这时我点我的添加按钮的时候，却添加不了行了。我是刚接触js不久的小白一个， 您能给我再详细的解释下么？感激不尽

追答

你的行如果添加不了的话，看看报什么错，学习js要学会使用调试工具，
去百度一下怎么使用firebug等javascript调试工具。
js代码很容易写错，写错一个字母，你的代码就运行不正确，而且写的
过程中你也不知道你会写错，因为js只有在运行的时候才知道错了。
所以只能靠细心，以及学会使用调试工具去发现bug

你页面一开始本来就存在的input框。
可以通过元素选择器选择出来，然后被日历控件初始化。
但是你后来手动添加的行。里面的input框只是普通的输入框。
你虽然加了class="datapicker“
但是这一点作用也没有，

并没有任何地方帮你初始化日历控件。不是吗？
所以你再append到dom中之后，要手动初始化一次。

追问

嗯，我大概明白了您的意思了！可能是由于刚接触，还有许多要学习的地方。谢谢您的指导，看的出来您是大牛！不知道方便加下您的QQ么？希望能多向您学习学习！我的QQ是742511872

追答

不是大牛，只是js爱好者而已，59688159