指定的值 "undefined" 不是有效数字

Question

我正在学习有关公司库存的考试。我想我可以帮自己一个忙，在为这次考试学习的同时学习一些关于编码的新知识。通常我在公司只做很少的前端javascript。

我想做的是设置一个有 2 个输入行的 table。

第 1 行：我输入的内容第 2 行：我输入的总和

我放置了一个按钮，该按钮应将我在第 1 行输入的值提供给第 2 行中的另一个字段。

当我的输入类型是数字时，我得到这个：指定的值 "undefined" 不是有效数字。该值必须与以下正则表达式匹配：-?(\d+|\d+.\d+|.\d+)([eE][-+]?\d+)?

当我的输入类型是文本时，我得到：未定义

我很确定我的功能有问题，但我无法弄清楚，当我搜索我的问题时，我只找到更复杂的情况，我也不明白。

提前感谢您的帮助:)

<script>
    function test() {
        var x = document.getElementById("1").value;
        document.getElementById("ro").value = x;
    }
</script>
</head>
<body>
<table>
    <tr><td><b><button onclick="test()">test</button></b></td></tr>
    <tr><td>&nbsp;</td></tr>
    <tr>
        <td>
            <div id="flex-table">
                    <table id="names">
                    <!--Names--><!--Names-->
                        <caption>A: Vermögen</caption>
                            <tr><th>I. Anlagevermögen</th></tr>
                            <tr><td class="first">Grundstücke</td></tr>
                            <tr><td class="second">Gernotstraße</td> </tr>
                    </table>
                    <table id="input">
                    <!--Input--><!--Input-->
                        <caption>&nbsp;</caption>
                            <tr><th><p>€</p></th></tr>
                            <tr><td>&nbsp;</td></tr>
                            <tr><td><form id="1"><input type="number" value="0"></form></td></tr>
                    </table>
                    <table id="values">
                    <!--Values--><!--Values-->
                        <caption>&nbsp;</caption>
                            <tr><th><p>€</p></th></tr>
                            <tr><td>&nbsp;</td></tr>
                            <tr><td><input id="ro" type="number"value="0" readonly></td></tr>
                    </table>
                </div>
        </td>
    </tr>
</table>

Answer 1

错误

首先 id 不仅仅是数字。所以你必须混合一些字符串
并且 document.getElementById("string1") 放置在 form 而不是 input.so 将 id 添加到输入而不是 form

<script>
  function test() {
    var x = document.getElementById("string1").value;
    document.getElementById("ro").value = x;
  }
</script>


<body>
  <table>
    <tr>
      <td><b><button onclick="test()">test</button></b></td>
    </tr>
    <tr>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>
        <div id="flex-table">
          <table id="names">
            <!--Names-->
            <!--Names-->
            <caption>A: Vermögen</caption>
            <tr>
              <th>I. Anlagevermögen</th>
            </tr>
            <tr>
              <td class="first">Grundstücke</td>
            </tr>
            <tr>
              <td class="second">Gernotstraße</td>
            </tr>
          </table>
          <table id="input">
            <!--Input-->
            <!--Input-->
            <caption>&nbsp;</caption>
            <tr>
              <th>
                <p>€</p>
              </th>
            </tr>
            <tr>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td>
                <form><input id="string1" type="number" value="0"></form>
              </td>
            </tr>
          </table>
          <table id="values">
            <!--Values-->
            <!--Values-->
            <caption>&nbsp;</caption>
            <tr>
              <th>
                <p>€</p>
              </th>
            </tr>
            <tr>
              <td>&nbsp;</td>
            </tr>
            <tr>
              <td><input id="ro" type="number" value="0" readonly></td>
            </tr>
          </table>
        </div>
      </td>
    </tr>
  </table>

Answer 2

您正在读取 form 的值，它没有任何值。您可能想从 input 元素中读取值。

function test() {
  var x = document.getElementById("1").value;
  document.getElementById("ro").value = x;
}

<table>
  <tr>
    <td><b><button onclick="test()">test</button></b></td>
  </tr>
  <tr>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>
      <div id="flex-table">
        <table id="names">
          <caption>A: Vermögen</caption>
          <tr>
            <th>I. Anlagevermögen</th>
          </tr>
          <tr>
            <td class="first">Grundstücke</td>
          </tr>
          <tr>
            <td class="second">Gernotstraße</td>
          </tr>
        </table>
        <table id="input">
          <caption>&nbsp;</caption>
          <tr>
            <th>
              <p>€</p>
            </th>
          </tr>
          <tr>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td>
              <input id="1" type="number" value="0">
            </td>
          </tr>
        </table>
        <table id="values">
          <caption>&nbsp;</caption>
          <tr>
            <th>
              <p>€</p>
            </th>
          </tr>
          <tr>
            <td>&nbsp;</td>
          </tr>
          <tr>
            <td><input id="ro" type="number" value="0" readonly></td>
          </tr>
        </table>
      </div>
    </td>
  </tr>
</table>

Answer 3

您的第二个 table 应该按以下方式更正。 id 值“1”指的是表单元素而不是输入元素。

<table id="input">
     <!--Input--><!--Input-->
     <caption>&nbsp;</caption>
     <tr><th><p>€</p></th></tr>
     <tr><td>&nbsp;</td></tr>
     <tr><td><form><input type="number" value="0" id="1"></form></td></tr>
</table>

指定的值 "undefined" 不是有效数字

The specified value "undefined" is not a valid number

html

javascript

datatable

input

getelementbyid