Question

使用html中的这个表单：

<form name="testform" onsubmit="return processForm(this)">
Number 1: <input type="text" name="number1"/><br />
Number 2: <input type="text" name="number2"/><br />
Number 3: <input type="text" name="number3"/><br />
Number 4: <input type="text" name="number4"/><br />
Number 5: <input type="text" name="number5"/><br />
Number 6: <input type="text" name="number6"/><br />
<input type="submit" value="Send numbers"/>
</form>

这个javascript方法：

var num1 = 0,
num2 = 0,
num3 = 0,
num4 = 0,
num5 = 0,
num6 = 0;
function processForm(form) {
var inputs = form.getElementsByTagName("testform");
var textValues = {};
for(var x = 0; x < inputs.length; x++) {
    if(inputs[x].type != "text") {
        continue;
    }
    textValues[inputs[x].name] = inputs[x].value;
}

num1 = textValues['number1'];
num2 = textValues['number2'];
num3 = textValues['number3'];
num4 = textValues['number4'];
num5 = textValues['number5'];
num6 = textValues['number6'];

document.write(num1);
document.write(num2);
document.write(num3);
document.write(num4);
document.write(num5);
document.write(num6);

return false;
}

按下发送号码时：

我不明白为什么会得到：

undefinedundefinedundefinedundefinedundefinedundefined
这些未定义的变量，为什么会在浏览器的另一个标签页中打印出来？

Answer 1

var inputs = form.getElementsByTagName("testform");

应该是

var inputs = form.getElementsByTagName("input");

Answer 2

页面加载后，您可能永远不会使用document.write。它将擦除页面及其上的脚本。

也许你的意思是

FIDDLE

var textValues = {}; // here in case you need them elsewhere.
function processForm(form) {
  var output=[];
  for(var x = 0; x < form.elements.length; x++) {
    var field = form.elements[x];
    if(field.type == "text") {
      var val = parseInt(field.value,10);
      if (isNaN(val)) val=0; // set the value to 0 if not a number  
      textValues[field.name] = val;
      output.push(val);
    }
  }
  document.getElementById("out").innerHTML=output.join(",");
  return false;
}

向您的网页添加一些<div id="out"></div>

Answer 3

getElementsByTagName期望控件的tag name找到（在这种情况下为input），而不是父控件的name。

因此你需要：

var inputs = form.getElementsByTagName("input");

另外，请在div：

中设置内容

在html中：

<div id="output" />

JS：

var s = "" + num1
      + "<br />" + num2
      + "<br />" + num3
      + "<br />" + num4
      + "<br />" + num5
      ;

document.getElementById("output").innerHTML = s;

演示jsfiddle。

无法发送表格

3 个答案: