具有下拉菜单的温度转换器

时间:2015-11-30 05:30:40

标签: javascript html

我正在尝试制作温度转换器,从下拉菜单中选择一种温度,然后输入温度,然后转换为另外两种温度形式。华氏度选项工作正常,但我无法弄清楚如何使摄氏和开尔文选项工作。

<!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>

1 个答案:

答案 0 :(得分:0)

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

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