Question

这是我的代码：

function drawBgrImage() {

    var random = Math.round(Math.random() * 8 + 1);
    var folder;
    var path;

    if (window.innerWidth <= 768) {
        folder = "xs";
    } else if (window.innerWidth <= 1200) {
        folder = "sm";
    } else {
        folder = "lg";
    }

    path = '"url(/wp-content/themes/BLANK-Theme/images/' + folder + '/' + random + '.jpg)"';
    console.log(path);
    document.getElementById("bgrImg").style.backgroundImage = path;
    /*document.getElementById("bgrImg").style.backgroundImage = "url(/wp-content/themes/BLANK-Theme/images/lg/2.jpg)";*/
}


window.onload = drawBgrImage();

在文件夹xs，sm和lg中我有9个.jpg文件。函数.drawBgrImage（）用于绘制1到9之间的数字，并在指定的#bgrImg上设置图像背景。虽然var path返回相同的值，但作为注释行它不起作用。

有什么想法吗？提前谢谢。

Answer 1

它不起作用，因为onload应该是一个函数，但是你没有提供一个函数。它应该是：

window.onload = drawBgrImage;

通过在函数名之后加上括号，您可以立即调用它并指定window.onload返回值（在您的情况下未定义）。

另一个问题是您将路径网址包装成不必要的引号。修复如下：

path = 'url(/wp-content/themes/BLANK-Theme/images/' + folder + '/' + random + '.jpg)';

Answer 2

替换：

path = '"url(/wp-content/themes/BLANK-Theme/images/' + folder + '/' + random + '.jpg)"';

使用：

path = 'url(/wp-content/themes/BLANK-Theme/images/' + folder + '/' + random + '.jpg)';

Javascript中的随机背景图像

2 个答案: