Jquery插件不适用于通过Ajax加载的元素

Jquery plugin not working for elements loaded via Ajax

本文关键字：Ajax 加载 元素 插件 不适用 适用于 Jquery      更新时间：2023-09-26

>描述：我正在处理一个项目，该项目加载了从我的数据库派生的到期日期的元素。 我正在使用一个Jquery插件，它使用HTML5数据类型属性作为"结束日期"。 当元素加载到 DOM 中时，一切正常，但我无法弄清楚如何让这个插件在通过从滚动函数触发的 ajax 加载的元素上运行。 诚然，Javascript不是我的强项，我也不是在寻找编码答案......我只是在寻找方向。 显然有些事情我根本不知道，或者我理解我的问题的方式是关闭的，因为 4 天的谷歌搜索和反复试验没有产生任何结果。 谢谢大家！

编辑：这是我尝试过的 -

1） 一个 ajax 完整函数 - 

$(document).ajaxComplete( function(){ $('.countdown').countdown(); });

2）添加在我的PHP结果中回显的脚本标签 -

<script>$('.countdown').countdown();</script>

3）将其添加到我的.scroll函数中 - 

$(function() {
    $(window).scroll(function() {
        if($(window).scrollTop() + $(window).height() == $(document).height()) {
            if (is_loading == false) { // stop loading many times for the same page
                // set is_loading to true to refuse new loading
                is_loading = true;
                // display the waiting loader
                $('#loader').show(500);
                // execute an ajax query to load more statments
                $.ajax({
                    url: 'JSON-TEST/load_more.php',
                    type: 'POST',
                    data: {last_id:last_id},
                    success:function(data){
                        // now we have the response, so hide the loader
                        $('#loader').hide(500);
                        // append: add the new statments to the existing data
                        $('#content').append(data);
                        // set is_loading to false to accept new loading
                        is_loading = false;
                        $('.countdown').countdown();
                    }
                });
            }
       }
    });
});

这三个都成功调用了脚本。我可以分辨，因为该div实际上填充了内容，但是，我在计时器中得到了所有零。

将 .on 方法与事件委托表单一起使用。这基本上包括将事件的侦听委托到您尝试侦听的元素的最近父节点。根据经验，始终将事件委托给 dom 中已经存在的最接近的父级。 由于性能原因，不要一直到文档。

像这样：

$（"closest-parent-of-the-element"）.on （"event-that-you-want"， "element-loaded-through-ajax"， function （e） {侦听器代码在这里})

这应该可以解决问题。

尝试使用 live ： http://api.jquery.com/live/

它适用于在初始文档之后加载的元素。

相关文章：