jQuery：克隆元素和事件
每当我使用ajax动态创建新内容，.clone（），append（）等时，新元素就会丢失我编程的任何触发器和事件=（
在复制之后，在复制元素上添加类的其他元素上工作的简单事物不再起作用。 任何新的ajax内容都不起作用。 命令按钮不再起作用。 我能做什么？
我正在克隆这个HTML，命令按钮不再起作用。 样式化span元素不再适用于CLONED元素：
ID: Status: Display Hide
*Date: *Title:
*Venue: Telephone:
URL:
Address: *City:
State: ZIP: *Country:
Comments:
添加了新评论，11/03/2011：
好的，我发现了问题，我的jQuery出错了。 现在，当我添加.clone（true）ALMOST时一切正常。
我的新问题是UI datepicker。 克隆HTML后，当我单击新克隆的日期字段时，焦点将转到克隆数据的（旧）日期字段。 更重要的是，如果我选择一个日期，则值将转到旧的日期字段 – 不再是新克隆的日期字段。
这是我的ajax代码（成功完成后）：
UI datepicker代码：
$("input[name='date']").datepicker({ dateFormat: 'yy-mm-dd', changeMonth: true, changeYear: true, numberOfMonths: 3, showButtonPanel: true});
阿贾克斯：
...ajax code... function(data) { var $msg = eval(data); if( $msg[0] == 1 ) { //#var.new $id = '#'+$msg[1]; $data = $("#new"); $new = $data.clone(true); $new.find('input.datefield').datepicker(); $new.attr("id", $id); $new.children('[name="id"]').val($id); $new.children('[name="id"]').attr("value", $id); $new.children(":input").each(function() { var $value = $(this).val(); $(this).attr("value", $value); }); $new.prepend( "
" ); $commands = $("#blank").children("#commands").clone(true); $commands.children("#add").text("Update"); $commands.children("#add").attr("pk", $id); $commands.children("#add").attr("name", "update"); $commands.children("#add").attr("id", "update"); $commands.children("#reset").text("Delete"); $commands.children("#reset").attr("pk", $id); $commands.children("#reset").attr("name", "delete"); $commands.children("#reset").attr("id", "delete"); $new.append( $commands ); //#animation //blank.slideUp $("#blank").slideUp(2500, function(){ $("#ADDNEW").html("► New:"); //$("#blank").clone().prependTo( $("#active") ); //$("#blank").prependTo( "#active" ); //active.slideUp $("#active").slideUp("slow", function(){ $("#ON").html("► Active:"); $("#active").prepend( $new ); $('#reset').trigger('click'); //active.slideDown $("#active").slideDown(8500, function(){ $("#ON").html("▼ Active:"); //blank.slideDown $("#blank").slideDown(3500, function(){ $("#ADDNEW").html("▼ New:"); load_bar(0); }); //end: anumation.#blank.slideDown }); //end: anumation.#active.slideDown }); //end: anumation.#blank.slideUp }); //end: anumation.#active.slideUp //$("#new").fadeOut(2000, function(){ //START: blank //alert( $("#blank").html() ); //$dad = $("#new"); //$dad.children('input[name!="id"][name!="country"], textarea').val(''); //$dad.children('[name="country"]').val("United States"); //$dad.children('[name="date"]').focus(); //END: blank //$("#new").fadeIn(2000, function(){ //alert( $msg ); //}); //end: anumation.fadeIn //}); //end: anumation.fadeOut } //end: if else { //var varMSG = data; //alert( "Hello" ); alert( $msg ); //$("#add").attr("disabled", false); //$("#reset").attr("disabled", false); load_bar(0); } //end: if.else }//end: $.post.function ); //END:$.post }); //END:ajax
.clone( true )可以解决问题。
文档： http ： //api.jquery.com/clone/
嗨，我有一个类似的用例，我有一些动态生成的内容，包含一个按钮，点击事件响应原始按钮，但不是生成的按钮，我以前做过：
$('.someclass').on('click', function() {
但我解决了我的问题，通过像这样取代现场：
$('.someclass').live('click', function() {
如果使用$（’。class’）之类的东西设置处理程序。单击（…）
尝试这样的事情：$（’。class’）。live（’click’，…）
Live适用于可能尚不存在的类的元素。
我终于让UI datepicker正常工作了。 我必须在克隆之前完全删除datepicker并在克隆元素之后添加它。 UI的人应该让我们更容易。 去搞清楚！
就在克隆之前：
//#datepicker $("input[name='date']").datepicker( "destroy" ); $("input[name='date']").removeClass("hasDatepicker").removeAttr('id');
克隆后：
$("input[name='date']").datepicker({ dateFormat: 'yy-mm-dd', changeMonth: true, changeYear: true, numberOfMonths: 3, showButtonPanel: true});