jquery不能绑定事件

Question

function tickettype(num){
if(num==1){
$('#Order_details').html('<table id="tab_1" width="100%" border="0" cellspacing="0" cellpadding="0" class="order-table"><tr><td>登机者姓名：</td><td>出发日期：</td></tr><tr><td><input type="text" name="" id=""/></td><td><input type="text" name="DepartureDate" id="DepartureDate"/></td></tr><tr><td>起始地：</td><td>目的地：</td></tr><tr><td><input type="text" name="from" id="from"/></td><td><input type="text" name="to" id="to"/></td></tr><tr><td>机票类型：</td><td>舱位类型：</td></tr><tr><td><select id=""><option value="Adults">Adults</option><option value="Children">Children</option></select></td><td><select id=""><option value="economy">economy</option><option value="business">business</option><option value="allCabins">allCabins</option></select></td></tr><tr><td><input type="button" id="return" value="返程" /></td><td><input type="button" id="nexts" value="下一张" /></td><td><input type="button" id="cancel" value="取消" /></td></tr></table>');
}
num++;

$('#cancel').unbind();
$('#cancel').click(function(){
alert(111);
tickettype(num);
});

$('#return').unbind();
$('#return').click(function(){
$('table:last tr:eq(6) td:lt(2)').remove();
$('#Order_details').append('<table id="tab_'+num+'" width="100%" border="0" cellspacing="0" cellpadding="0" class="order-table"><tr><td>登机者姓名：</td><td>出发日期：</td></tr><tr><td><input type="text" name="" id=""/></td><td><input type="text" name="DepartureDate" id="DepartureDate"/></td></tr><tr><td>起始地：</td><td>目的地：</td></tr><tr><td><input type="text" name="from" id="from"/></td><td><input type="text" name="to" id="to"/></td></tr><tr><td>机票类型：</td><td>舱位类型：</td></tr><tr><td><select id=""><option value="Adults">Adults</option><option value="Children">Children</option></select></td><td><select id=""><option value="economy">economy</option><option value="business">business</option><option value="allCabins">allCabins</option></select></td></tr><tr><td></td><td><input type="button" id="nexts" value="下一张" /></td><td><input type="button" id="cancel" value="取消" /></td></tr></table>');
tickettype(num);
});

$('#nexts').unbind();
$('#nexts').click(function(){
$('table:last tr:eq(6) td:lt(2)').remove();
$('#Order_details').append('<table id="tab_'+num+'" width="100%" border="0" cellspacing="0" cellpadding="0" class="order-table"><tr><td>登机者姓名：</td><td>出发日期：</td></tr><tr><td><input type="text" name="" id=""/></td><td><input type="text" name="DepartureDate" id="DepartureDate"/></td></tr><tr><td>起始地：</td><td>目的地：</td></tr><tr><td><input type="text" name="from" id="from"/></td><td><input type="text" name="to" id="to"/></td></tr><tr><td>机票类型：</td><td>舱位类型：</td></tr><tr><td><select id=""><option value="Adults">Adults</option><option value="Children">Children</option></select></td><td><select id=""><option value="economy">economy</option><option value="business">business</option><option value="allCabins">allCabins</option></select></td></tr><tr><td><input type="button" id="return" value="返程" /></td><td><input type="button" id="nexts" value="下一张" /></td><td><input type="button" id="cancel" value="取消" /></td></tr></table>');
tickettype(num);
});
}页面初始化调用这个函数，返程和下一张都能绑定上按钮单击事件，就取消只能绑定第一个表格，后面的绑定不了单击事件，求助

Answer 1

这个就是完整的、html你加个div id='Order_details'就行

Answer 2

页面新用js增加html dom后，再运行一次解除/绑定的函数

Answer 3

您好，能详细点说吗？
我删除新增的table，是因为新增的问题而没绑定上事件吗？

Answer 4

$('#nexts').bind('click',function(){

Answer 5

正解，LZ可以去看看live的源码，方法很巧妙

Answer 6

jquery ui的时间插件楼下的谁用过、、
怎么绑定到新生成的input框上面就是动态绑定时间控件、、

Answer 7

通过on可以为还没有生成的元素绑定事件。
$(parent).on("事件类型","本元素",function(event){})
说明：该事件的绑定形式是借助于绑定父类元素然后进行筛选而实现的。
     $(parent)是元素的任意父类元素可以为document.body元素
     第二个参数为通过jQuery选择器选择的动态添加的本元素。
如果一个元素时直接添加到页面上时，$(parent)可以使用$(document.body)
eg:
$(function(){
     $(xx).bind("click",function(event){
          $(document.body).append("<div>dsdfs<div>");
     });
     $(document.body).on("click","div",function(event){
          .....
     });
});
注意：只有on才能为动态生成的元素添加事件。

Answer 8

通过on可以为还没有生成的元素绑定事件。
$(parent).on("事件类型","本元素",function(event){})
说明：该事件的绑定形式是借助于绑定父类元素然后进行筛选而实现的。
     $(parent)是元素的任意父类元素可以为document.body元素
     第二个参数为通过jQuery选择器选择的动态添加的本元素。
如果一个元素时直接添加到页面上时，$(parent)可以使用$(document.body)
eg:
$(function(){
     $(xx).bind("click",function(event){
          $(document.body).append("<div>dsdfs<div>");
     });
     $(document.body).on("click","div",function(event){
          .....
     });
});
注意：只有on才能为动态生成的元素添加事件。