将元素添加到主体后运行javascript

我有一个

元素，除非某些功能被激活，否则它不会出现在页面上。我想在页面上显示此

后将其删除

当且仅当添加此

元素时，如何运行JavaScript代码

我是新手，希望能得到一些帮助。谢谢

元素是由jquery生成的，并且只有类名

详细说明：

我正在现有web应用程序中实现excel导出。
我正在使用一个表单围绕过滤器进行搜索，并使用ajaxgrid gridstate。 此表单将提交给具有相应viewmodels的控制器

我提交表格的代码如下：

$(function () {
    $('div.btn-group #export-citizen-list').on('click', function () {
        var gridstate = $('#citizenIndexGrid').ajaxgrid('getState');
        var form = $('#create-citizen-csv-file');

        // add ajaxgrid state to post data
        $.each(gridstate, function (k, v) {
            form.addAjaxgridHidden(k, v);
        });

        // submit entire form, with ajaxgrid state
        form.submit();

        // remove all hiddenfields that belongs to ajaxgrid
        form.find(":hidden.ajaxgrid").remove();
        document.getElementById("filterSearch").className = "default ui-button ui-widget ui-state-default ui-corner-all";
        $('#filterSearch').removeAttr('disabled');
// function that removes unwanted <div> ---->$('.ajaxWorkingNotification').slideUp();
    })

    jQuery.fn.addAjaxgridHidden = function (name, value) {
        return this.each(function () {
            var input = $('<input>').attr('type', 'hidden').attr('name', name).attr('class', 'ajaxgrid').val(value);
            $(this).append($(input));
        });
    };
});

$（函数（）{
$（'div.btn-group#导出公民列表'）。在（'click'，函数（）{
var gridstate=$（'citizenIndexGrid'）.ajaxgrid（'getState'）；
var form=$（“#创建公民csv文件”）；
//将ajaxgrid状态添加到post数据
$.each（网格状态，函数（k，v）{
表.addAjaxgridHidden（k，v）；
});
//提交完整的表格，带有ajaxgrid状态
表单提交（）；
//删除属于ajaxgrid的所有隐藏字段
form.find（“：hidden.ajaxgrid”）.remove（）；
document.getElementById（“filterSearch”）.className=“默认ui按钮ui小部件ui状态默认ui角点全部”；
$（'过滤器搜索'）.removeAttr（'禁用'）；
//删除不需要的-->$（'.ajaxWorkingNotification'）.slideUp（）的函数；
})
jQuery.fn.addAjaxgridHidden=函数（名称、值）{
返回此。每个（函数（）{
变量输入=$（''）.attr（'type'，'hidden'）.attr（'name'，name）.attr（'class'，'ajaxgrid'）.val（value）；
追加（$（输入））；
});
};
});

当我提交表单时，excel被下载，不需要的

被插入DOM中。问题是，在这种情况下，我不知道何时返回回发。因此，我不知道何时插入此

---

希望这能澄清我的问题。

你可以这样做

// Assuming your element is created by this line ...
$(".your_elements_class_name").ready(function() {
    // write code here
    // this is executed after the element is created and added to DOM
})

---

您可以通过在DOM节点插入事件上实现侦听器来实现这一点

有一个关于如何检测DOM节点插入的解释&纯javascript代码演示了它是如何工作的

如果您喜欢jQuery版本，那么下面是我从上面的链接翻译的示例代码

HTML:

Javascript:

$(function () {
    $('#addme').click(function () {
    var div = $('<div/>').attr('id', 'mydiv').html("Hello");
    $('#container').append(div);
  });

  var handler = function (e) {
    if (e.originalEvent.animationName == "nodeInserted")
        alert("An HTMLElement has been inserted to DOM tree !")
  };

  var eventSignature = 'MSAnimationStart';
  if ($.browser.webkit) eventSignature = 'webkitAnimationStart';
  if ($.browser.mozilla) eventSignature = 'animationstart';
  $(document).on(eventSignature, handler);
});

$（函数（）{
$（'#addme'）。单击（函数（）{
var div=$（''）.attr（'id'，'mydiv'）.html（“你好”）；
$（“#容器”）.append（div）；
});
变量处理程序=函数（e）{
如果（e.originalEvent.animationName==“节点插入”）
警报（“已将HTMLElement插入到DOM树中！”）
};
var eventSignature='MSAnimationStart'；
如果（$.browser.webkit）eventSignature='webkitAnimationStart'；
if（$.browser.mozilla）eventSignature='animationstart'；
$（文档）.on（事件签名，处理程序）；
});

---

也许您可以使用Jquery的隐藏和显示-。加载页面时隐藏该元素，如果要显示该元素，则可以显示该元素。@ramilu页面已加载。但是没有插入div。它只在按下按钮时插入。在这种情况下，当您通过代码添加元素时，为什么不能执行其他代码呢。也许你可以用例子详细解释你的问题，然后我可以为你提供一个解决方案。@Ramilu问题更新。希望这有帮助。我已经更新了我的问题，我希望是澄清我的问题。这仍然有效吗？无论发生什么&当垃圾元素被插入到DOM树中时，这都将始终有效。只需将

#container

和

div#mydiv

替换为真正的定位器，就可以了。

@keyframes nodeInserted {  
    from { opacity: 0.99; }
    to { opacity: 1; }  
}

#container div#mydiv {
    animation-duration: 0.001s;
    animation-name: nodeInserted;
}

$(function () {
    $('#addme').click(function () {
    var div = $('<div/>').attr('id', 'mydiv').html("Hello");
    $('#container').append(div);
  });

  var handler = function (e) {
    if (e.originalEvent.animationName == "nodeInserted")
        alert("An HTMLElement has been inserted to DOM tree !")
  };

  var eventSignature = 'MSAnimationStart';
  if ($.browser.webkit) eventSignature = 'webkitAnimationStart';
  if ($.browser.mozilla) eventSignature = 'animationstart';
  $(document).on(eventSignature, handler);
});