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

Question

我正在使用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属性，但我怎么可以访问自定义属性data-val使用serializeArray()

Answer 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>