Question

我最近启动了java脚本并完成了HTML和CSS。我的问题是，由于某种原因，我的表格意味着将厘米转换为英寸不会以第二种形式显示输出....虽然我的第一种形式是将摄氏温度转换为华氏温度。第二个奇怪的是，第一个表单仅在删除第二个表单的所有相关代码时才有效。我是javascript的新手，非常感谢任何帮助

这是我的HTML和java脚本。

<!DOCTYPE html>
<html>

<head>
    <link rel="stylesheet" type="text/css" href="First Website.css" />
    <title>
    </title>
</head>

<body>


    <h1 class="title">Conversion Table
        <h1>
            <!--The div styling the box for the conversion table -->

            <div class="convert">
                <!--The title to the conversion of fahrenheit to celsius  -->
                <h1>Convert Fahrenheit to celsius </h1>

                <!--The input form for Celsius -->
                <p>
                    <input id="c" onkeyup="convert('C')">:Celsius</p>
                <!--The input form for Fahrenheit -->
                <p>
                    <input id="f" onkeyup="convert('F')">:Fahrenheit</p>

            </div>

            <div class="convert1">
                <h1>Convert Centimetres to inches</h1>

                <p>
                    <input id="m" onkeyup="convert1('M')">:Centimetres</p>
                <p>
                    <input id="i" onkeyup="convert1('I')">:inches</p>
            </div>



</body>
<script>
    // the function to convert fahrenheit to celsius and vice versa
    function convert(degree) {
        var x;
        if (degree == "C") {
            x = document.getElementById("c").value * 9 / 5 + 32;
            document.getElementById("f").value = Math.round(x);
        } else {
            x = (document.getElementById("f").value - 32) * 5 / 9;
            document.getElementById("c").value = Math.round(x);
        }
    }

    //the function to convert centimetres to inches

    function convert1(distance) {
        var y;
        if (distance == "M") {
            y = document.getElementById("m").value / 0.393701;
            document.getElementById("i").value = Math.round(y);
        }

        else {
            y = (document.getElementById("m").value * 1.393701;
            document.getElementById("i").value = Math.round(y)

        }
    }
</script>

<style>
    .convert {
        border: 2px solid black;
        width: 450px;
        top: 100px;
        position: static;
        background-color: #CD6A44;
        float: left;
        color: black;
        font-size: 20px;
        display: inline-block;
    }

    .title {
        position: fixed;
        /* or absolute */
        left: 45%;
        font-size: 40px;
    }

    body {
        background-color: #262626
    }

    h1 {
        font-ize: 25px;
    }

    .convert1 {
        border: 2px solid black;
        width: 450px;
        top: 100px;
        position: static;
        background-color: #CD6A44;
        float: right;
        color: black;
        font-size: 20px;
        display: inline-block;
    }
</style>

</html>

Answer 1

第63行中的小语法问题，它是：

 y = (document.getElementById("m").value * 1.393701;

应该是：

 y = document.getElementById("i").value * 1.393701; //i for inch
 document.getElementById("m").value = Math.round(y) //Set meters

任何IDE经常突出显示，你可能不会使用它，我建议你安装VS Code并安装JSHint（提示和使用）和JSLint（警告和建议）

祝你好运学习JS年轻的padawan

Answer 2

在函数convert1中你的行

y = (document.getElementById("m").value * 1.393701;
document.getElementById("i").value = Math.round(y)

应该是

y = (document.getElementById("i").value * 2.54;
document.getElementById("m").value = Math.round(y)

你得到了＆＃34;我＆＃34;和＆＃34; m＆＃34;在错误的地方，1.393 ......号码是错误的。 1英寸是2.54厘米而不是1.393厘米。

同样在你的CSS中，你有一个拼写错误

h1{
font-ize:25px;
}

不＆＃34; s＆＃34;在字体大小！这有帮助吗？

就个人而言，在你让JS工作之前我一个人留下css。

我的转换表单有问题，将英寸转换为厘米

2 个答案: