Jquery 无限滚动脚本无法识别事件

Question

我最近在 tumblr 上摆弄 JQuery，我意识到我一直遇到的问题之一是我的无限滚动脚本没有标记新的使用 Jquery 脚本的帖子我已经设置了单击时如何处理帖子，无论它具有我的脚本正在寻找的相同 class 名称，还是位于 [=31] 的末尾=].那么，我将如何将其与新的 HTML 元素相关联？

<script>
   $(".window").click(function(){inactiveall(); cal = cal + 1; $(this).css("z-index", cal);
   $(this).find(".title-bar-98").css("background-image", curactiveheader); $(this).find(".title-bar-text").css("color", curactivetitle); tumblractive()});
            
   function tumblractive(){ desktop.left = "0px"; document.body.style.overflowY = "scroll";
      tumblrButtonOpen = false; tumblrtaskbar.backgroundImage = github + "img/scrollbarempty.png')";
      docelem.style.setProperty('--taskbar1top1', curcolgray); docelem.style.setProperty('--taskbar1top2', curcolblack);
      docelem.style.setProperty('--taskbar1bottom1', curcolwhite); docelem.style.setProperty('--taskbar1bottom2', curcollightg)}
   function tumblrminimize() { tumblrButtonOpen = true; inactiveall(); desktop.left = "-20000px"; document.body.style.overflowY = "hidden"}
</script>

这是一般页面设置；

<html>
    <body>
        <div id="desktop" style="width:1010px; margin-top:20px;">
            {block:Posts}
                <div class="window" style="width: 475px; max-width: 475px; margin-bottom: 20px; margin-right: 20px; position: absolute">
                    <div class="win98titlebarbutton"><div class="close"></div></div>
                    <div class="win98titlebarbutton"> <div class="maximize"></div></div>
                    <div class="win98titlebarbutton" onclick="tumblrminimize();"> <div class="minimize"></div></div>
                    <div class="win98titlebarbutton" onclick="twilightload()"> <div class="help"></div></div>
                    <div class="title-bar-98"><div class="title-bar-text" id="tumblrtext"> very.vunnies on Tumblr - Internet Explorer</div></div>
                    <div class="window-body"> 
                         <!-- post data here -->
                    </div>
                </div>
            {/block:Posts}
        </div>
    </body>
</html>

所以我的主要问题是这个；当呈现为具有 JQuery 脚本时，我将如何更新帖子，就像前 10 个帖子一样？更确切地说;为什么会有这个问题？我的假设是 Jquery 根本不需要重新检查页面以查看出于优化原因要检查的内容，或者脚本不知道将两者相关联。

对 JQuery 有点陌生，我一直避免用它做任何事情，因为在 3 个月前甚至 HTML 之前都没有任何经验。但是，环顾四周，我找不到太多关于其他人有同样问题的信息，我假设是因为使用这样的脚本的人通常不会将一百万行 js 绑定到他们身上。

任何指点都会很棒，谢谢！

编辑：我一直在尝试各种解决方案，例如；

document.querySelector('#desktop').addEventListener('click', handler, false);
function handler(e) {
   calupdate(); tumblractive(); $(this).css("z-index", cal); 
   $(this).find(".title-bar-98").css("background-image", curactiveheader); 
   $(this).find(".title-bar-text").css("color", curactivetitle)
}

问题在于它可以工作，但只解决 .desktop 元素的第一个子元素，也就是。第一个 window 元素，而不是页面的其余部分。因此，如果这将是我必须使用的解决方案，那么有什么最佳方法可以获取所述元素的 ID 以更改我正在单击的所述子元素。

Answer 1

我刚刚将我的脚本推入了无限滚动脚本。

$(document).ready(function(){
                var infScr = $('body').hasClass('infinite_scrolling'), twoCol = $('body').hasClass('two_column'), $container = $('#desktop');
                if( infScr && twoCol ){
                    $container.imagesLoaded(function(){$container.masonry({itemSelector:'.window', isAnimated: true})});
                    $container.infinitescroll({itemSelector: '.window'}, function(newElements) { 
                        var $newElems = $( newElements ).hide()
                        var height = $(".window").find(".photoset").attr("height")
                        $(".window").find(".photoset").css("height", height + "px")
                        
                        $(this).find(".title-bar-98").css("background", "linear-gradient(90deg, " + curtbgradinactive1 + "," + curtbgradinactive2 + ")")
                        $(".window").click(function(){calupdate(); tumblractive(); $(this).css("z-index", cal); var desktopleft
                            $(this).find(".title-bar-98").css("background", "linear-gradient(90deg, " + curtbgradactive1 + "," + curtbgradactive2 + ")")
                            $(this).find(".title-bar-text").css("color", curactivetitle)});
                            
                        $(".plinks-con").click(function(){if (plinksdrop == false){$(this).find("postdrop").css("margin-left", "49px"); plinksdrop = true 
                            } else if (plinksdrop == true){$(this).find("postdrop").css("margin-left", "-20000px"); plinksdrop = false}})
                        $(".plinks-con").mouseleave(function(){$(this).find("postdrop").css("margin-left", "-20000px"); plinksdrop = false})
                        
                        $newElems.imagesLoaded(function(){ $newElems.show()
                            var $newElemsIDs = $newElems.map(function () {return this.id}).get()
                            $container.masonry('appended', $newElems)})})}
                window.setInterval(updateClock, 6000); updateClock()});

Jquery 无限滚动脚本无法识别事件

Jquery events not recognised with infinite scroll script

javascript

jquery

event-handling

mouseevent

infinite-scroll