每個jQuery變量范圍

Question

我正在嘗試構建一個包含每個表單元素的所有值的數組。 警報只能找到，但在console.log數據是空的，我不明白javascript中的作用域是如何工作的？

  var data = new Array();
  $("#page2 input").each(function(index) {
      alert($(this).attr('id'));
      data[$(this).attr('id')] = $(this).val();
  });

非常感謝你的時間，

Answer 1

有一點需要知道，JavaScript中的Array只能有正整數索引（實際上它們被視為字符串）。

將字符串分配給鍵時，您將為Object分配屬性。

你可能想要這樣的東西......

var data = {};
$("#page2 input").each(function() {
   data[this.id] = this.value;
});

jsFiddle 。

如果你只想要id屬性。

var data = $("#page2 input").map(function() { 
               return this.id;
           }).get();

jsFiddle 。

Answer 2

您正在嘗試創建一個對象 （ new Object()或{ } ），而不是數組。

Answer 3

范圍是正確的。 如果控制台沒有在Array中顯示entires，那么我猜你的ID屬性不是數字。

並不意味着數據不存在。 只是意味着控制台選擇只顯示數字索引。

考慮Chrome控制台中的以下輸入：

var arr = new Array();
arr['test'] = 'test';

arr;  // []
arr.test;  // 'test'

雖然為數組提供非數字屬性是有效的JavaScript，但在大多數情況下這是錯誤的方法。

Answer 4

你的問題是：

...每個表單元素的所有值...

但您的選擇器僅適用於某種特定形式的輸入元素。 假設您實際上想要表單中所有控件的值，那么以下POJS可能適合：

function getFormValues(formId) {
  var data = {};
  var form = document.getElementById(formId);

  if (form) {
    var control, controls = form.elements;

    if (controls) {
      var i = controls.length;

      while (i--) {
        control = controls[i];
        data[control.id] = control.value;
      }
    }
  } 
  return data;
}

假設每個控件都有一個ID，這不是必需的。 如果某些控件沒有id，則可能需要使用name屬性，因此：

        data[control.id || control.name] = control.value;

在某些情況下，您的控件可能沒有id或名稱（例如，表單需要但不提交其值的控件，例如提交和重置按鈕），因此：

        var idOrName = control.id || control.name;
        if (idOrName) {
          data[idOrName] = control.value;
        }

您可能還需要處理具有相同名稱的控件，因為最后訪問的控件的值將替換先前同名控件的值。

Answer 5

如果您使用輸入id作為鍵，那么您創建的是Object，而不是Array。

var data = new Object();