计算在文本框中输入的值并放在另一个文本框中？

Question

我有一个带有两个文本框的表单。 我想在一个框上输入一个数字，按转换链接，让它在第一个框中将数字计算为摄氏，然后将其放在第二个文本框中。 到目前为止，它不起作用，我觉得我缺少一些小东西...该怎么办？

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">
body
{
background-color: white;
}

h2
{
position: absolute;
left:200px;
top:5px;
color: cadetblue;
}
p
{
text-align: center;
font-family: times new roman;
color: black;
}
</style>
<script>
        function f2cCalc(input)
    {
        var fbox = document.getElementById(input);
        var cbox = document.getElementById(cinput);
       var f = parseInt(fbox.value);
       var cel = Math.round(5/9*(f-32));
       document.getElementById(cbox).value=cel;
      }
</script>
    </head>
    <body>
        <form method="get" action="">

    <h2>Temp calculator</h2>
<br />
<br />
<br/>
<br/>
<br/>
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        F<input id="finput" type="number" STYLE="background-color: cadetblue; color: green;" value="0"/>
        &nbsp;&nbsp;&nbsp;&nbsp;
        C<input id="cinput" type="number" STYLE="background-color: cadetblue; color: green;" value="0"/>

        <a href="javascript:f2cCalc(finput)">Convert</a>

        </form>
    </body>
</html>

enter code here

Answer 1

这两行可能是导致您出现问题的原因：

var fbox = document.getElementById(input);
var cbox = document.getElementById(cinput);

改成：

var fbox = document.getElementById(input);
var cbox = document.getElementById('cinput');

基本上，JavaScript尝试从变量而不是DOM加载ID。

Answer 2

您的代码中有错字。 Belwo提到了三行问题。

更改

 var fbox = document.getElementById(input);
 var cbox = document.getElementById(cinput);
 document.getElementById(cbox).value=cel;

至

 var fbox = document.getElementById('finput');
 var cbox = document.getElementById('cinput');
 cbox.value=cel;

演示场

Answer 3

你需要很少的修改

<a href="javascript:f2cCalc('finput')">Convert</a>

和

var cbox = document.getElementById('cinput');

检查这个小提琴

Answer 4

或者您可以得到自切片面包以来最甜的东西。 jQuery。 将这个坏男孩插入您的头部标签：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

实际上，我为您准备了小提琴。 jQuery使事情变得容易得多。 希望这对您有用。

Answer 5

您的函数调用应类似于：

 <a href="javascript:f2cCalc('finput')">Convert</a>

计算在文本框中输入的值并放在另一个文本框中？

问题描述

5 个解决方案

解决方案1
0 2013-09-14 20:04:49

解决方案2
0 2013-09-14 20:05:55

解决方案3
0 2013-09-14 20:19:00

解决方案4
0 2013-09-14 20:33:37

解决方案5
0 2013-09-14 20:59:07

计算在文本框中输入的值并放在另一个文本框中？

问题描述

5 个解决方案

解决方案1 0 2013-09-14 20:04:49

解决方案2 0 2013-09-14 20:05:55

解决方案3 0 2013-09-14 20:19:00

解决方案4 0 2013-09-14 20:33:37

解决方案5 0 2013-09-14 20:59:07

解决方案1
0 2013-09-14 20:04:49

解决方案2
0 2013-09-14 20:05:55

解决方案3
0 2013-09-14 20:19:00

解决方案4
0 2013-09-14 20:33:37

解决方案5
0 2013-09-14 20:59:07