如何确定输入是否是javascript中的数组类型?

时间:2017-05-24 07:38:16

标签: javascript jquery user-input

<input type="text" name="members[0].name"> <input type="text" name="members[0].address">

Javascript code :

              var input_text;
              var inputs=document.querySelectorAll("input[type=text],textarea, select");
                _.each(inputs, function(e, i) {
                    var keyName = $(e).attr("name");
                    if (typeof keyName != "undefined") {
                        var text = $(e).parent().find('label').text();

                        if ($(e).is('select')) {
                            input_text = input_text + "<tr><td>" + text + "</td><td>  " + $(e).find(':selected').text() + "</td></tr>";
                        }
                        else {
                             input_text = input_text + "<tr><td>" + text + "</td><td>  " + $(e).val() + "</td></tr>";
                        }
                    }

                });
                console.log(input_text);
正如您所看到的,除了上面提到的输入之外,我得到了$(e).val()中所有输入的值。

3 个答案:

答案 0 :(得分:1)

这些输入不是浏览器中的“数组”。他们只是在name中使用一个命名约定,它被某些服务器端处理(例如,在PHP中)用于在提交时为您组织表单数据。

我不知道“预览”是什么意思,但您可以通过简单地遍历表单元素(yourForm.elements)或使用yourForm.querySelectorAll("input[type=text]")来查看这些元素的值(或$(yourForm).find("input[type=text]")使用jQuery - 我首先错过了您问题的jquery标记。

theForm.elements的示例:

document.querySelector("form input[type=button]").addEventListener("click", function() {
  var form = document.getElementById("the-form");
  Array.prototype.forEach.call(form.elements, function(element) {
    if (element.type === "text") {
      console.log(element.name + " = " + element.value);
    }
  });
});
<form id="the-form">
  <input type="text" name="members[0].name" value="name 0">
  <input type="text" name="members[0].address" value="address 0">
  <input type="text" name="members[1].name" value="name 1">
  <input type="text" name="members[1].address" value="address 1">
  <input type="text" name="members[2].name" value="name 2">
  <input type="text" name="members[2].address" value="address 2">
  <div>
    <input type="button" value="Show">
  </div>
</form>

theForm.querySelectorAll的示例:

document.querySelector("form input[type=button]").addEventListener("click", function() {
  var form = document.getElementById("the-form");
  Array.prototype.forEach.call(form.querySelectorAll("input[type=text]"), function(element) {
    console.log(element.name + " = " + element.value);
  });
});
<form id="the-form">
  <input type="text" name="members[0].name" value="name 0">
  <input type="text" name="members[0].address" value="address 0">
  <input type="text" name="members[1].name" value="name 1">
  <input type="text" name="members[1].address" value="address 1">
  <input type="text" name="members[2].name" value="name 2">
  <input type="text" name="members[2].address" value="address 2">
  <div>
    <input type="button" value="Show">
  </div>
</form>

$(theForm).find的示例:

$("form input[type=button]").on("click", function() {
  var form = document.getElementById("the-form");
  $(form).find("input[type=text]").each(function() {
    console.log(this.name + " = " + this.value);
  });
  // Of course, we could have just used `$("#the-form input[type=text]").each`...
  // but I was assuming you'd already have `form`
});
<form id="the-form">
  <input type="text" name="members[0].name" value="name 0">
  <input type="text" name="members[0].address" value="address 0">
  <input type="text" name="members[1].name" value="name 1">
  <input type="text" name="members[1].address" value="address 1">
  <input type="text" name="members[2].name" value="name 2">
  <input type="text" name="members[2].address" value="address 2">
  <div>
    <input type="button" value="Show">
  </div>
</form>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

答案 1 :(得分:0)

使用formID获取输入类型值的方法很多

 $('#formId input, #formId select').each(
        function(index){  
            var input = $(this);
        }
    );

OR

var formElements = new Array();
$("form :input").each(function(){
    formElements.push($(this));
});

OR

var $form_elements = $("#form_id").find(":input");
希望它可以帮到你。

答案 2 :(得分:0)

您可以使用latitude > 90serializeArray

serialize
  

.serializeArray()方法创建一个JavaScript对象数组,可以编码为JSON字符串。 Doc