使用javascript从html输入获取值

Question

我是这个论坛的新手，我希望能够从我在javascript中的html输入中获取价值。 现在我有此代码：

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PWS</title>
</head>

<body bgcolor="#009933" text="#FFFFFF">
<H1 align="center">PWS Julia en Sophie</H1>
<hr>
<br>

<strong>DOUCHE</strong>
<table>
    <tr>
    <td>Temperatuur</td>
    <td><input type="text" name="dtemp" onClick="calculateTotal()" /></td>
    </tr>
    <tr>
    <td>Tijd</td>
    <td><input type="text" name="dtijd" onClick="calculateTotal()" /></td>
    </tr>
    <tr>
    <td>Hoe vaak per week</td>
    <td><input type="text" name="dfreq" onClick="calculateTotal()" /></td>
    </tr>
</table>

<br>
<strong>BAD</strong>
<table>
    <tr>
    <td>Temperatuur</td>
    <td><input type="text" name="btemp" onClick="calculateTotal()" /></td>
    </tr>
    </tr>
    <tr>
    <td>Hoe vaak per week</td>
    <td><input type="text" name="bfreq" onClick="calculateTotal()" /></td>
    </tr>
</table>

<script type="text/javascript">
    var dTemp = document.getElementsByName("dtemp").value;
    document.write(dTemp);
</script>

显然，它不起作用。 因为dTemp值保持未定义。 谁能帮我，谢谢你，鲍勃

Answer 1

document.getElementsByName返回一个数组，因此您必须引用元素的位置：

var dTemp = document.getElementsByName("dtemp")[0].value;

我还建议为您的输入提供ID，因为似乎每个名称在您的情况下都是唯一的，因此您可以使用document.getElementById

Answer 2

document.getElementsByName("dtemp")将为您提供元素数组，一一遍历并从中获取值。

var elements = document.getElementsByName("dtemp");
var firstValue = elements[0].value;

Answer 3

1）您需要索引getElementsByName的结果，如其他答案所述； 将[0]附加到document.getElementsByName("dtemp") 。

2）您不能在页面加载后执行的代码中使用document.write 。 它将用书面内容代替当前文档。 改为写入一个元素。

3）您根本没有定义函数calculateTotal 。 将JavaScript代码包装在一个函数中，例如

<div id=result></div>
<script>
function calculateTotal() {
    var dTemp = document.getElementsByName("dtemp")[0].value;
    document.getElementById('result').innerHTML = dTemp; }
</script>

4）您还有很长的路要走，因为现在您的代码不再尝试计算任何东西，因此几乎不应该在input元素上使用onclick来开始计算（相反，在其上进行onchange或在一个单独的按钮元素上进行onclick ）。 确实，您应该阅读一个不错的JavaScript入门。

使用javascript从html输入获取值

问题描述

3 个解决方案

解决方案1
3 2013-10-14 19:51:20

解决方案2
0 2013-10-14 19:53:33

解决方案3
0 2013-10-14 20:31:53

使用javascript从html输入获取值

问题描述

3 个解决方案

解决方案1 3 2013-10-14 19:51:20

解决方案2 0 2013-10-14 19:53:33

解决方案3 0 2013-10-14 20:31:53

解决方案1
3 2013-10-14 19:51:20

解决方案2
0 2013-10-14 19:53:33

解决方案3
0 2013-10-14 20:31:53