html - 使用 .load() 函数刷新 div

Question

$(document).ready(function(){
$('#container').load('contents/home.html');
$('#nav ul#navigation li a').click(function(){
        var page = $(this).attr('href');
        $('#container').fadeOut('slow').load('contents/' + page + '.html').fadeIn('slow');
        return false;
    });
});

这在 div容器中加载页面时效果很好。 home.html包含nivoSlider，当整个页面刷新时它运行良好，但在使用功能加载页面后 home.html再次加载，则无法正常工作。我必须刷新整个页面才能刷新. 因此，每次将页面加载到 div 时，我都需要一个代码来刷新。#container$('#container').load('contents/' + page + '.html')nivoSliderdivdiv#container

Answer 1

确保将独特的知识封装在代码中的一个位置。如果您需要刷新某些内容，请确保将其放在一个地方，然后根据需要调用它。您的代码可能如下所示：

$(document).ready(function() {
    var container = $('#container');
    function loadContent(url, callback) {
        return container.load(url, {}, function () {
            // Add code here to refresh nivoSlider

            // Run a callback if exists
            if (callback) {
                callback();
            }
        });
    }
    loadContent('contents/home.html');

    $('#nav ul#navigation li a').click(function (event) {
        var page = $(this).attr('href');
        container.fadeOut('slow').loadContent('contents/' + page + '.html').fadeIn('slow');
        event.preventDefault();
    });
});