使用 JavaScript 在 HTML 中循环数据时遇到问题答案

【问题标题】：Trouble looping through data in HTML using JavaScript使用 JavaScript 在 HTML 中循环数据时遇到问题
【发布时间】：2017-04-30 11:22:00
【问题描述】：

我正在使用 javaScript 处理 149 个输入类型编号字段，但我无法让它工作。我设置了条件，如果这些数字字段的值为负数、浮点数或 0，它将使用

返回错误消息

alert("错误信息");

我正在通过如下的 for 循环遍历我的输入类型

<button onclick="myFunction()">Try it</button>
<script>
function myFunction() {
var i; var x = 0; var s; var val; var test; 
for (i = 1; i < 150; i++) {
  s = '' + i; //converts i into string

  val = document.getElementById(s).value; //Puts string value into val
  test = +val; //Converts val into number
//Error Checking
}

我已经在较小的输入类型 = 数字字段（例如 10）上尝试了此代码，并且我所有的错误标志都有效，但是每当我使用我需要的数字 149（设置为 150，因为我希望它比150) 我没有收到任何来自我的功能的错误消息或活动。

【问题讨论】：

哇！ 149 个输入字段？
“但是每当我使用我需要的数字 149 ...我没有收到任何错误消息或来自我的函数的活动。” 您在页面上有 149 个实际输入吗?
向我们展示您的 HTML。
pict 基本上就是这个样子。只需显示数据库中的数据并允许某人更新他们希望为任何产品订购的数量。
@zer00ne 是的，我愿意

标签： javascript html for-loop

【解决方案1】：

检查以下示例。

//For Demo Puropse 
for(i=1;i<300;i++){
var node = document.createElement("input");
node.id=i
node.value=i
  document.getElementById("stage").appendChild(node)
}

function checkValues(){
  for(i=1;i<300;i++){
    elemValue = document.getElementById(i).value
    if(! isInteger(elemValue) || ! elemValue){
      alert("Error ! : " + elemValue + "@" + i)
      return;
    }
  }
  
  alert("Passed")
}

function isInteger(x) {
    return x % 1 === 0;
}

<button onclick="checkValues()">Check</button>
<br/>
<div id="stage"></div>

【讨论】：

【解决方案2】：

这是我的代码。我正在从一个我也不想显示凭据的数据库中读取。在我的代码中，您将看到包含评论问题的评论。有没有一种方法可以让我只使用 php 来获取产品编号和数量，以便我可以在 form.php 中使用它。这是一种发布方法，但正如问题所说，我对这种编码语言相当陌生。希望这段代码 sn-p 能告诉你更多关于我真正想要完成的事情。

        <form action="form.php" method="post">


    <table cellpadding="6">
      <tr>
        <th>Description</th>
        <th>Price</th>
        <th>Weight</th>
        <th>Image</th> 
        <th>Quantity</th>
      </tr>
    <!-- PHP LANGUAGE -->
    <?PHP
        $sql = "SELECT * FROM parts";
        $q = $conn->query($sql) or die("ERROR: " . implode(":", $conn->errorIndo()));

        while( $row = $q->fetch(PDO::FETCH_ASSOC))
        {

            echo '<tr>' .
                '<td>' . $row['description'] . '</td>' .
                '<td>' . $row['price'] . '</td>' .
                '<td>' . $row['weight'] . '</td>' . 
                '<td> <img src="' . $row[pictureURL] .'" alt="' . $row[number] . '" style="width:50px;height:50px;">' .
                '<td> <input type="number" id= "'. $row[number] . '"  value="0">' .
                '</td>' . '</tr>';
        }
        echo "</table>";

    ?> 
    </table> <br>



    <input type="button" id="submit" value="Submit" />
    </form>
    <script>
    var i; var x = 0; var s; var val; var test; var array = [];
    $('form').submit(function(){{
        var value = $(this).val();

        for (i = 1; i < 5; i++) {
          s = '' + i;  //stores i as string 
          //getsElement id val string and stores into val
          val = document.getElementById(s).value; 
          test = +val; //Converts string into tester int for error checking 

          if tester < 0 { alert("Must enter in one product!"); return;} 

          //CHECKS FOR FLOATS IN Quantity FIELD
          else if (Math.floor(test) != Math.ceil(test)) { alert("Cannot have float quantities!"); return; } 
          else { 
                //My attempt at coding a block that captures the product 
                //Number, and the quantity selected. Is there a way 
                /* QUESTION */
                array.push(i); array.push(x) 
           }
        }
        if (x == 0) { alert("Must have at least one product quantity to continue!"); return; }
        else { alert("good!"); } 
    }}

    </script>
        </body>
    </html>

【讨论】：