克隆使用JQuery clone()方法动态添加html内容

时间:2013-07-28 18:11:12

标签: jquery ajax load clone dynamically-generated

我有一个包含用户信息的行的表。

当某些用户点击该行的<a id="modify1" data-userid="value">链接时,隐藏的<div id="formContainer"></div>会动态填充<form>标记(通过JQuery load('getuserupdateform.php?user_id=X')方法)进行更新那个用户。

调用load()方法后,我调用另一个函数showModal(),将<div id="formContainer"></div>(以及动态添加的内容)放入模态窗口。

但问题是动态添加的<form>元素不存在于模态窗口中。

以下是相关代码:

    $('a.modify').click(function() {
        $('#formContainer).load('getuserupdateform.php?user_id=X');
        return showModal($(#formContainer));
    });

  showModal = function(element) {
    var modal;
    modal = element.clone();
    //Code for creating the modal window
  }

clone()方法似乎不会克隆动态添加的<form>元素。

我该如何解决这个问题?

1 个答案:

答案 0 :(得分:1)

首先,您应该使用$('a#modify1'),因为modify1是ID而不是类。

您正在运行showModal,而不检查load方法是否已完成,因此无法找到要克隆的任何<form>

尝试将showModal作为回调加载函数:

$('a#modify').click(function() {
    $('#formContainer).load('getuserupdateform.php?user_id=X', function(){
        return showModal($(#formContainer));
    });
});

这样,只有load请求完成后,showModal才会运行。

有关回调如何运作的详细说明:http://api.jquery.com/load/