html表单输入字符串作为javascript中的字符数组

Question

 function reverse(){
    var name_id = document.getElementsByName("name_id");
    var out_id = [];
    for(var i=name_id.length - 1 ; i<name_id.length ; i--) {
        for(var j=0 ; j<name_id.length ; j++) {
            out_id[j] = name_id[i];
        }
    }
    for(i=0 ; i<name_id.length; i++) {
      document.getElementById("output-3").innerHTML = out_id;
    }
 }

我是StackExchange的新手。

顺便说一下，javascript代码是一个函数反向()，它反转html页面中的字符串输入。但是当我使用以下方法实现它时：

<form class="form-inline" role="form">
  <div class="form-group">
  <br><br>
  <label class="label label-info" for="Name">Name : </label>
  <input type="text" class="form-control" id="name" name="name_id[]" placeholder="Enter Name">
  <br>
  <label class="label label-success" id="output-3" form="output"></label></div>
  <button class="btn btn-warning" type="submit" id="submit" onclick="reverse();">Reverse</button>
</form>

页面被卡住了，什么也没发生。我需要帮助，因为这是我第一次尝试使用输入数据作为数组，我很困惑如何做到这一点。上面的代码是我理解javascript的努力。请检查代码和任何修改或建议，请告诉我。

Answer 1

您有一个无限循环，在这里：

for(var i=name_id.length - 1 ; i<name_id.length ; i--)

您的变量i会减少，因此您的条件i < name_id.length将始终为真。您可能应该将条件更改为i >= 0。

Answer 2

此演示可能对您有所帮助：http://jsfiddle.net/dh680nkh/1/

Javascript

document.getElementById("submit").onclick = function(e) {
    e.preventDefault();
    var name_id = document.getElementById("name");
    var out_id = [];

    for (var i = 0, len = name_id.value.length; i <= len; i++) {
        out_id.push(name_id.value.charAt(len - i));
    }
    for ( var i = 0; i < out_id.length; i ++ ) {
        document.getElementById("output-3").innerHTML = out_id.join('');
    }
}

<form class="form-inline" role="form">
        <div class="form-group">
            <br><br>
           <label class="label label-info" for="Name">Name : </label>
           <input type="text" class="form-control" id="name" name="name_id[]" placeholder="Enter Name">
           <br><label class="label label-success" id="output-3" form="output"></label></div>
        <button class="btn btn-warning" type="submit" id="submit">Reverse</button></form>