jquery动态添加代码，引入的日历插件不能用。

Question

如题，
而且我用live方法有个很严重的bug。
就是我直接点我绑定的input框没反应，但是我点其他的input框两次后，再回来点就能触发出来。
求解。

<script>
$(function(){
$("[name=arrival_time]").live('click',function(){
$(this).datepicker({
dateFormat : 'yy-mm-dd',
//dayNames : ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
//dayNamesShort : ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
dayNamesMin : ['日','一','二','三','四','五','六'],
monthNames : ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'],
monthNamesShort : ['一','二','三','四','五','六','七','八','九','十','十一','十二'],
altField : '#abc',
altFormat : 'dd/mm/yy',
// appendText : '日历',
// showWeek : true,
// weekHeader : '周',
firstDay : 1,
// disabled : true,
changeMonth :true,
changeYear : true,
maxDate :"",//这个控制今天以后的日期是否可选
// minDate :0,
yearRange : '1950:2020',
// minDate:-1m
});
})

})
</script>
html代码
<tr>
<th style="width:30%;">到达时间：</th>
<td style="width:70%">
<input class="ss" type="text" readonly="readonly" name="arrival_time" value="">
</td>
</tr>
到达时间会有很多。我到时候要动态加新的。但是新加的就是我前面说的那个问题。

Answer 1

live 的 click 事件里面绑定了datepicker函数，即点击文本框的时候才绑定datepicker，你当然要点两次。一般datepicker控件只需要绑定一次就行了，即：$(this).datepicker({...}); 这样就行了。
你如果有多个需要添加，可以包装一个函数，文本框控件作为参数，类似：
function bindpicker(obj)
{
$(obj).datepicker({});

}

执行了datepicker，就不需要再live click 了

可以试试 :)

追问

我要动态生成很多input，新生成的绑定不了我才用的live。有什么什么办法谢谢

追答

动态生成input的时候如果有ID，就传入bindpicker函数中绑定时间控件；
如果没有ID，最好生成一个ID，生成ID是最佳最简单的办法

如果实在没有ID，就通过循环
$.each('[name=arrival_time]',function(idx,con){
$(con).datepicker({});

});

循环的时候要避免重复绑定，可能你还需要借助一个数组放置已绑定的input；

也可以考虑用jquery 动态创建文本框，类似：
var newinput = $("",{

type:'text',

val:'text',

function:function(){

$(this).addClass('active');

}

});

newinput.datepicker({});

$('input的父容器').append(newinput);

Answer 2

直接用bind的就可以

追问

我现在是能点出来，但是就像我说的
bug在这里。
就是我直接点我绑定的input框没反应，但是我点其他的input框两次后，再回来点就能触发出来。
求解。

追答

这个是逻辑问题，你把加载datepicker的代码拿到click事件外面去，应该这也写：
添加个ID

$("#timer").datepicker({
dateFormat : 'yy-mm-dd',
//dayNames : ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
//dayNamesShort : ['星期日','星期一','星期二','星期三','星期四','星期五','星期六'],
dayNamesMin : ['日','一','二','三','四','五','六'],
monthNames : ['一月','二月','三月','四月','五月','六月','七月','八月','九月','十月','十一月','十二月'],
monthNamesShort : ['一','二','三','四','五','六','七','八','九','十','十一','十二'],
altField : '#abc',
altFormat : 'dd/mm/yy',
// appendText : '日历',
// showWeek : true,
// weekHeader : '周',
firstDay : 1,
// disabled : true,
changeMonth :true,
changeYear : true,
maxDate :"",//这个控制今天以后的日期是否可选
// minDate :0,
yearRange : '1950:2020',
// minDate:-1m
});
})

这样就可以了