Question

我正在尝试编写一个代码，每隔“N”秒异步加载一个背景。

OK！现在一切正常！但是第一张图片在15秒后开始。如何在页面加载结束时加载？

(function(jQuery) {
    window.setInterval(function() {
        jQuery.ajax({
            url: 'http://example.com/background.php',
        }).done(function(data) {
            console.log("done Ok!");
            var newImage = new Image();
            newImage.onload = function() {
                jQuery('body').css({"background-image": data, "color": "red !important"});
                console.log("ok2!");
            };
            newImage.src = data;
        });
    }, 15000);
})(window.jQuery);

问题已解决，但现在我需要如何加载背景图像。

这里的问题是： https://stackoverflow.com/questions/25766943/changing-background-image-using-jquery-and-ajax-but-async-and-in-background

Answer 1

将循环函数移出window.interval调用，因为它是自己的函数。

(function(jQuery) {
    function intervalFunc() {
        jQuery.ajax({
            url: 'http://example.com/background.php',
        }).done(function(data) {
            console.log("done Ok!");
            var newImage = new Image();
            newImage.onload = function() {
                jQuery('body').css({"background-image": data, "color": "red !important"});
                console.log("ok2!");
            };
            newImage.src = data;
        });
    }

    window.setInterval(intervalFunc, 15000); // Start the interval timer
    intervalFunc();  // Run once first after page load
})(window.jQuery);

Answer 2

尝试添加

header('Access-Control-Allow-Origin: *');

在background.php中

使用jQuery和AJAX更改背景图像

2 个答案: