javascript - jquery 代码在 ajax 加载的内容中不起作用

Question

是的，我在这里查看了相同的文章，谷歌提供了帮助。但我是设计师，不是程序员。我可以复制\粘贴一些代码，甚至更改一些东西，但是这个问题对我来说太难了。

所以，我的主页上有新闻，当您向下滚动时，下一页会使用 ajax 加载。有一个脚本，显示\隐藏每个帖子的评级栏。但是这段代码在加载的内容中不起作用。请修复它，如果它对您来说不难的话。

附注我试过研究 on() 或 live，但因为我以前很难过，不是我的水平。

$(document).ready(function() {

var element = $('#dle-content .main-news');
for (i=0; i<element.length; i++)
    {
        $(element[i]).addClass('news-'+i);
    }

$('#dle-content .main-news').hover(
    function() {
        $('.main-news-hidden').stop(true);
        $(this).find('.main-news-hidden').animate({
            'bottom':'0'
        },400
        );
    }, function() {
        $('.main-news-hidden').stop(true);
        $(this).find('.main-news-hidden').animate({
            'bottom':'-120'
        }, 0);
        $('.main-news-hidden').stop(true);
});

$('.top-news li').hover(
    function() {
        $('.top-news-hidden').stop(true).fadeOut(0);
        $(this).find('.top-news-hidden').animate({
            'opacity':'1'
        },400, function()
            {
                $(this).fadeIn();
            }
        );
    }, function() {
        $('.top-news-hidden').stop(true);
        $(this).find('.top-news-hidden').fadeOut(100);
});

var element2 = $('.top-news li');
for (i=0; i<element2.length; i++)
    {
        $(element2[i]).find('.list').append(i+1);
    }

});

Answer 1

尝试将您的代码包含在 ajax html 数据中，或者您可以在追加 html 之后将脚本添加到完成函数中。

$.ajax({
  url: "yourUrl",     
}).done(function(data) {
   $("#yourId").html(data);   // Solution 1 :  your content is loaded with ajax, Also this data has your jQuery script
   // Solution 2:  Now start you can call your script via function or add directly here (only html data is needed)
   yourFunction();
   //Solution 3: Now add your jquery code directly
   $(".someClass").click(function(){
     //events
   });
});

这是使用 jQuery 访问 ajax 数据的三种不同方式。