Javascript 显示在文本框中输入的值列表_Javascript

Javascript 显示在文本框中输入的值列表

javascript

Javascript 显示在文本框中输入的值列表,javascript,Javascript,我希望在每次单击“转换”按钮时获得所有转换的值 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title>Temperature Conversion</title> <style type="text/css"> body { font: 1em calibri, arial

我希望在每次单击“转换”按钮时获得所有转换的值

   <!DOCTYPE html>
<html>

<head>

    <meta charset="UTF-8" />
    <title>Temperature Conversion</title>


    <style type="text/css">

    body
    {
        font: 1em calibri, arial;
    }
    button
    {
        background-color: transparent;
        margin: 5px;
        width: 300px;
    }
    h1, h2, h3, h4
    {
        text-align: center;
    }
    table
    {
        border: 8px double;
        margin-left: auto;
        margin-right: auto;
        padding: 2px;
        height: 500px;
        width: 30%;
    }
    td
    {
        border: 1px solid;
    }
    td#topcell
    {
        height: 200px;
        text-align: center; 
        vertical-align: middle;
    }
    td#midcell
    {
        height: 200px;
        text-align: center; 
        vertical-align: middle;
    }
    td#bottomcell
    {
        text-align: center; 
    }

    </style>

    <script type="text/javascript">

    function convertTemp() 
    {

        var c = document.getElementById('ctemp'), f = document.getElementById('ftemp');
        c.value = Math.round((f.value - 32) * 5 / 9);
        lblResult.innerHTML = c.value;
        document.getElementById("Fdegree").innerHTML = f.value;
        f.value = '';
                var list = [];
            var clist = [];            
                var str = document.getElementById("ftemp");
                list.push(str.value);
        clist.push(c.value);
                str.value = "";
                str.focus();
                var area = document.getElementById("txtArea");
                area.value = "";
                for (var i = 0; i < list.length; i++) {
                    area.value += list[i] + "\n";
                }
            for (var i = 0; i < clist.length; i++) {
                    area.value += clist[i] + "\n";
                }
            }
    </script>
</head>
<body>
    <main role="main">
            <table>
                <tr>
                    <td id="topcell">
                        <label for="Fahrenheit">Fahrenheit:</label>&nbsp;&nbsp;&nbsp;<input id="ftemp"><br />
                        <br />
                        <label for="Celcius">Celcius:</label>&nbsp;&nbsp;&nbsp;<input id="ctemp">&nbsp;&nbsp;&nbsp;
                        <br />
                        <br />
                        <br />
                        <br />
                        <br />
                        <br />
                        Fahrenheit&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Celcius                   
                    </td>
                </tr>
                <tr>
                    <td id="midcell">
                    <br />
                        <textarea rows="5" id="txtArea">
                        <p id="Fdegree"></p>
                        </textarea>
                    </td>
                </tr>
                <tr>
                    <td id="bottomcell">
                        <input type="button" value="Convert" onclick="convertTemp()" />

                    </td>
                </tr>
            </table>
    </main>
</body>
</html>


温度转换
身体
{
字体：1em calibri，arial；
}
按钮
{
背景色：透明；
保证金：5px；
宽度：300px；
}
h1，h2，h3，h4
{
文本对齐：居中；
}
桌子
{
边框：8px双倍；
左边距：自动；
右边距：自动；
填充：2px；
高度：500px；
宽度：30%；
}
运输署
{
边框：1px实心；
}
td#topcell
{
高度：200px；
文本对齐：居中；
垂直对齐：中间对齐；
}
中区
{
高度：200px；
文本对齐：居中；
垂直对齐：中间对齐；
}
td#底部电池
{
文本对齐：居中；
}
函数convertTemp（）
{
var c=document.getElementById（'ctemp'），f=document.getElementById（'ftemp'）；
c、 数值=数学四舍五入（（f.value-32）*5/9）；
lblResult.innerHTML=c.value；
document.getElementById（“Fdegree”）.innerHTML=f.value；
f、 值=“”；
var列表=[]；
var-clist=[]；
var str=document.getElementById（“ftemp”）；
列表推送（str.value）；
clist.push（c.value）；
str.value=“”；
str.focus（）；
var area=document.getElementById（“txtArea”）；
area.value=“”；
对于（变量i=0；i


塞尔修斯：












华氏摄氏度

<值>在华氏温度和摄氏度下中部应逐行适当显示。

下面是期望的结果：

您必须动态地为表创建trtd，其中包含一致的数据

var table = document.getElementById("myTable");
    var row = table.insertRow(0);
    var cell1 = row.insertCell(0);
    var cell2 = row.insertCell(1);
    cell1.innerHTML = "NEW CELL1";
    cell2.innerHTML = "NEW CELL2";

我不清楚你的目标。你的目标是坚持先前转换的值，然后追加新的转换，这样你就有了每个转换的日志？除了你的问题的范围之外：我会考虑使用CSS填充而不是<代码> <代码> > <代码> div < />代码>为你的总体布局，然后使用<<代码>表> <代码>“华氏”和“摄氏”“价值。这将更容易控制，因为您的演示文稿将不再那么依赖于您的标记。对不起。我对自己真正想要实现的目标还不够清楚。我用一个链接更新了我的帖子，描述了期望的结果。我找到了一种方法，将输入的所有值存储到数组中的两个文本框中。但不确定单击“转换”时如何显示所有内容