指定的值“未定义”不是有效数字答案

【问题标题】：The specified value "undefined" is not a valid number指定的值“未定义”不是有效数字
【发布时间】：2019-03-23 15:34:51
【问题描述】：

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

我要做的是设置一个包含 2 个输入行的表。

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

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

当我的输入类型是数字我得到这个：指定的值“未定义”不是有效数字。该值必须与以下正则表达式匹配：-?(\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>

【问题讨论】：

您的 id 必须分配给输入元素，而不是表单本身。
哦，我知道那很愚蠢，现在可以了。非常感谢！

标签： javascript html input datatable getelementbyid

【解决方案1】：

错误

首先id 不仅仅是数字。所以你必须混合一些字符串
并且document.getElementById("string1") 与form 一起放置而不是输入。所以将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>

【讨论】：

非常感谢，那是一个愚蠢的错误，但你能解释一下你对部分的意思吗，我认为你选择什么作为 id 并不重要吗？
是的没关系。你可以设置任何东西作为一个id。但这不是很好的做法。将来更多的编码和变量。它会更加混乱和复杂。使用一些相关的名称活动元素eg:input get username set id="username"。变量和名称定义是编码中最大的任务之一
好吧，我明白了，在习惯坏习惯之前最好先养成好习惯。谢谢你，prasanth :)

【解决方案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>

【讨论】：

【解决方案3】：

您的第二张表应按以下方式更正。 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>

【讨论】：