Javascript 背景转换器不工作

Question

我想在我的代码中实现背景图片更换器，但它似乎不起作用。

这是我的 JS：

function XAX() {
    var P = document.getElementById("background1");
    var O = document.getElementById("background2");
    var I = document.getElementById("background3");
    if {P.checked === true} {
        document.body.style.backgroundImage = "url(Gates.jpg)";
    }
    else if {O.checked === true} {
        document.body.style.backgroundImage = "url(City.jpg)";
    }
    else if {I.checked === true} {
        document.body.style.backgroundImage = "url(forest.jpg)";
    }
    }

这里是 HTML:

    <input type="radio" id="background1" name="background" >Gates of Argonath</input><br>
    <input type="radio" id="background2" name="background" >Minas Tirith</input><br>
    <input type="radio" id="background3" name="background" >Rivendell</input><br>
    <input type="button" value="Submit" onclick="XAX()">

Answer 1

请在下面找到正确的代码

<html>
    <body>
    <input type="radio" id="background1" name="background" >Gates of Argonath</input><br>
    <input type="radio" id="background2" name="background" >Minas Tirith</input><br>
    <input type="radio" id="background3" name="background" >Rivendell</input><br>
    <input type="button" value="Submit" onclick="XAX()">
    <body>
    <script>
    function XAX() {
        var P = document.getElementById("background1");
        var O = document.getElementById("background2");
        var I = document.getElementById("background3");
        if (P.checked == true) {
            document.body.style.backgroundImage = "url(Gates.jpg)";
        }
        else if (O.checked == true) {
            document.body.style.backgroundImage = "url(City.jpg)";
        }
        else if (I.checked == true) {
            document.body.style.backgroundImage = "url(forest.jpg)";
        }
    }
    </script>
</html>

你在 if 和 else if 语句后使用 {，你应该使用 (

Answer 2

if {P.checked === true} {
//TODO
}

你应该直接在 if 块上使用它，因为 element.checked return 布尔结果，你应该直接在 if 块上处理它，它们不需要检查任何一个 element.checked== =真|| element.checked === 1.

这是我的 fiddle 检查这个

https://jsfiddle.net/DeMaiz/tn6thygq/

Javascript 背景转换器不工作

Javascript background changer no working

javascript

background

image