Question

我需要将输入及其值输出到div中。但是，因为我需要将正确的标签与正确的输入匹配，并且某些字段允许空值，所以我遇到了匹配的问题。使用以下代码将每个标签/输入拉入一个数组，然后输出：

var inputArr = $('input, select').map(function(){
    return "<p>" + $(this).val() + "</p>";
}).get()

var labelArr = $('label').map(function(){
  return "<p>" + $(this).text() + "</p>";
}).get()

function setValuesForConfirm() {
//Clear Div Contents                
  $("#test-output-1, #test-output").html('');

  for (var i = 0; i < labelArr.length; i++) {
    $("#test-output-1").append(labelArr[i]);
  }

  for (var i = 0; i < inputArr.length; i++) {
    $("#test-output").append(inputArr[i]);
  }
}

因此，如果任何输入为空白，则字段与标签不匹配。

我的问题是，我可以使用.map（）函数将数组键命名为JS中的字段名称或ID吗？

JSFiddle Here

Answer 1

您可以使用输入创建对象：

var formObj={};

$('input, select').each(function(){
    formObj[this.name]={val: this.value, labelText: $(this).prev('label').text()}; 

});

然后当对象循环可以将html放在一起

$.each(formObj, function(key, item){
    var labelHtml='<p>'+item.labelText+'</p>';
    var inputHtml='<p>Name: '+ key+', value: '+item.val+'</p>';
    /* do something with html*/
})

Answer 2

虽然您所拥有的内容似乎对我有用，但.map创建了一个数组，并且您只能在JavaScript中的数组中使用数字序号键，因此您需要一个对象。

var inputArr = {};
$('input, select').each(function(){
    inputArr[$(this).attr('name')] = "<p>" + $(this).val() + "</p>";
});

http://jsfiddle.net/Mz9Vy/1/

使用.map（）和.get（）命名的数组键

2 个答案: