简体   繁体   中英

Temperature Converter with Drop down Menus

I am trying to make a temperature converter where you pick a type of temperature from a drop down menu, and then enter in a temperature, then it converts into the other two forms of temperature. The Fahrenheit option works fine, however I can't figure out how to make the Celsius and Kelvin option to work.

<!DOCTYPE html>
<html>
    <head>
        <style>
            body {
                background-color: #002b80;
            }

            p {
                color: white;
            }

        </style>
    </head>

    <body>

        <center>
        <form>
            <select id="temperature">
                <option value="f">Fahrenheit</option>
                <option value="c">Celsius</option>
                <option value="k">Kelvin</option>
            </select>
            <input type="text" id="fconvert" onkeyup="myFunction()">
        </form>
        <br>
        <br>
        <input type="text" id="cconvert">
        <input type="text" id="kconvert">
        <br>
        <br>
        <span id="demo"></span></p>

        <div id="temp">

        </div>
        </center>

        <script>
            function myFunction() {
                if(document.getElementById("temperature").value = "f") {
                    convertF();

                } else {
                    convertC();

                }
            }    

            function convertF() {
                var x = document.getElementById("fconvert").value;
                var convertF = x * 2;
                var convertC = x * 3;
                var convertK = x * 4;

                document.getElementById("cconvert").value = convertF;
                document.getElementById("kconvert").value = convertF;

            }


            function convertC() {
                var x = document.getElementById("fconvert").value;
                var convertF = x * 2;
                var convertC = x * 3;
                var convertK = x * 4;

                document.getElementById("cconvert").value = convertC;
                document.getElementById("kconvert").value = convertC;

            }


            function convertK() {
                var x = document.getElementById("fconvert").value;
                var convertF = x * 2;
                var convertC = x * 3;
                var convertK = x * 4;

                document.getElementById("cconvert").value = convertK;
                document.getElementById("kconvert").value = convertK;

            }

        </script>
    </body>
</html>

您应该使用===进行比较(如果不是安全类型,请使用==

if(document.getElementById("temperature").value === "f") {

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM