在javascript中多次点击填充输入字段

Question

我有以下代码应该通过 HREF 点击收集值。
每次单击一个数字时，它都会将其附加到文本字段“数字”的内容中。 当我单击提交时，它会转到一个评估“数字”内容的新页面。 当我单击预览并按预期填充“数字”时，它似乎在我的编辑器（HTML-Kit）中工作正常，但它在我的浏览器中不起作用。 文本字段保持空白。 这里似乎有什么问题？

<FORM ACTION="showcontent.htm" METHOD="post">
<input type="text" name="number" value="">
<TABLE BORDER="1">
    <TR>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '1';">1</A></TD>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '2';">2</A></TD>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '3';">3</A></TD>
    <TR>
    <TR>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '4';">4</A></TD>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '5';">5</A></TD>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '6';">6</A></TD>
    <TR>
    <TR>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '7';">7</A></TD>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '8';">8</A></TD>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '9';">9</A></TD>
    <TR>
    <TR>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + ',';">,</A></TD>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '0';">0</A></TD>
        <TD WIDTH="20" ALIGN="center"><A HREF="#" onclick="number.value=number.value + '.';">.</A></TD>
    <TR>
</TABLE><BR />
<BUTTON TYPE="submit">Show result</BUTTON><BR /><BR />

Answer 1

检查浏览器控制台显示number is not defined 。

为了引用表单中的字段，首先为表单命名：

<form name="calculator" ... >

然后使用点表示法选择特定的 DOM 元素，如下所示：

document.calculator.number;

现在你可以像这样附加到这个对象的value属性：

document.calculator.number.value += '1';

要编辑您的代码（加上添加结束</form>标记，并修复结束</tr>标记）：

<FORM name="calculator" ACTION="showcontent.htm" METHOD="post">
  <input type="text" name="number" value="">
  <TABLE BORDER="1">
    <TR>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '1';">1</A>
      </TD>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '2';">2</A>
      </TD>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '3';">3</A>
      </TD>
    </TR>
    <TR>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '4';">4</A>
      </TD>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '5';">5</A>
      </TD>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '6';">6</A>
      </TD>
    </TR>
    <TR>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '7';">7</A>
      </TD>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '8';">8</A>
      </TD>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '9';">9</A>
      </TD>
    </TR>
    <TR>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += ',';">,</A>
      </TD>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '0';">0</A>
      </TD>
      <TD WIDTH="20" ALIGN="center">
        <A HREF="#" onclick="document.calculator.number.value += '.';">.</A>
      </TD>
    </TR>
  </TABLE>
  <BR />
  <BUTTON TYPE="submit">Show result</BUTTON>
  <BR />
  <BR />
</FORM>