使用 serializeArray() 访问自定义属性答案

【问题标题】：access custom attribute using serializeArray()使用 serializeArray() 访问自定义属性
【发布时间】：2015-08-10 18:58:10
【问题描述】：

我正在使用serializeArray() 函数来获取name 和value 输入标签的属性驻留在form 标签中。

<form>
   <input type='text' data-val="Employee Name" value='john' name ='empName'/>
   <input type='text' data-val="Employee id" value='4333' name ='empId'/>
</form>

我可以访问name 和value 属性，但是我如何使用serializeArray() 访问自定义属性data-val

【问题讨论】：

标签： javascript jquery jquery-mobile

【解决方案1】：

在这种情况下你不能使用serializeArray，你可以在map()的帮助下尝试这样的事情

var arr=$('input').map(function(){ return $(this).data('val');}).get();
console.log(arr);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
   <input type='text' data-val="Employee Name" value='john' name ='empName'/>
   <input type='text' data-val="Employee id" value='4333' name ='empId'/>
</form>

如果您希望将结果作为名称值对，则使用

var arr = $('input').map(function() {
  return {
    [$(this).attr('name')] : $(this).data('val')
  }
}).get();
console.log(arr);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input type='text' data-val="Employee Name" value='john' name='empName' />
  <input type='text' data-val="Employee id" value='4333' name='empId' />
</form>

与serializeArray的输出相同

var arr = $('input').map(function() {
  return {
    name: $(this).attr('name'),
    value: $(this).data('val')
  }
}).get();
console.log(arr);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
  <input type='text' data-val="Employee Name" value='john' name='empName' />
  <input type='text' data-val="Employee id" value='4333' name='empId' />
</form>

【讨论】：

您的名称值对解决方案存在语法错误
@rafe 需要用 [ ] 包裹 prop