AJAX加载内容的jQuery函数-jQueryFunctionsOnAJAXLoadedContent

I have an unordered list that is being loaded from an external file using $.get(). Once that is loaded, the unordered list needs to be manipulated using .show() (it is display: none; by default) when the page loads.

我有一个无序列表,使用$ .get()从外部文件加载。一旦加载,无序列表需要在页面加载时使用.show()(显示:无;默认情况下)进行操作。

After reading many explanations, I understand why show() is not working on the loaded content. They say that you need to use live() (well, now .on()) to attach the a handler to an event, but all the examples are things like clicking and mousing over.

在阅读了很多解释后,我理解为什么show()不处理加载的内容。他们说你需要使用live()(好吧,现在.on())将一个处理程序附加到一个事件,但所有的例子都是点击和鼠标悬停的东西。

Ajax call:

$.get('/wordpress/wp-content/themes/nascar_plaza/inc/sidebar_login.php', function(data) {
    $('#site-header-nav-container > ul > li:last-child').append(data);
});

jQuery to run on loaded content:

jQuery在加载的内容上运行:

$('.current-menu-ancestor .sub-menu').css({
    display: 'block',
    width: '235px'
});
$('.current-menu-ancestor .sub-menu li').show();

Can someone give me an example on how to get the code above to run on the content after it has been loaded?

有人可以给我一个例子,说明如何在加载后获取上面的代码来运行内容吗?

2 个解决方案

var url = '/wordpress/wp-content/themes/nascar_plaza/inc/sidebar_login.php'

$.get(url, function(data) {

    //anything in this block runs after the ajax call

    $('#site-header-nav-container > ul > li:last-child').append(data);

    $('.current-menu-ancestor .sub-menu').css({ 
        display: 'block', 
        width: '235px' 
    }); 

    $('.current-menu-ancestor .sub-menu li').show(); 

});

$.get('/wordpress/wp-content/themes/nascar_plaza/inc/sidebar_login.php', function(data) {

   $('#site-header-nav-container > ul > li:last-child').append(data);

   $('.current-menu-ancestor .sub-menu').css({
       display: 'block',
       width: '235px'
   }).find('li').show();

});