Question

我有一个与将html输入名称转换为javascript对象相关的问题。例如，我有一个输入：

<input type="checkbox" name="product[1]">
<input type="checkbox" name="product[2]">

我有javascript代码：

var data = {};
$('input').each(function(){
    // need to do something like 
    data[$(this).attr('name')] = $(this).attr('checked');
})

我希望得到像这样的数据对象;

data = {
    product: {
        1: 'checked',
        2: 'checked'
    }
}

如果不使用正则表达式，这可能吗？

Answer 1

用文字值替换变量，你得到：

data["product[1]"] = true;

方括号没有意义，因为它们在字符串中，所以你不会得到任何结果。

有很多方法可以解决这个问题。您可以使用eval：eval("data."+this.name+" = "+(this.checked?"true":"false"));

但是，最好避免使用eval，请尝试以下方法：

var m = this.name.match(/(.*)\[(\d+)\]/);
data[m[0]][m[1]] = this.checked;

Answer 2

总的来说是可能的。您可以执行以下操作：

var noregexp = $(this).attr('name').split("[");
if (noregexp.length==2) {
    //should be
    var the_name = noregexp[0];
    var the_index = noregexp[1].substr(0,noregexp[1].length-1); //this will get the index with removed ]
}

我是从脑海里想出来的。这不是一个美丽的解决方案，而是一个没有你想要的正则表达式。

Answer 3

您可以使用以下方式获取数据结构：

var data = {product: []};
$('input').each(function(){
    data.product[$(this).attr('name').match(/product\[([\d]*)\]/)[1]] = $(this).prop('checked');
})
console.log(data);

检查 demo

如何将输入名称转换为JavaScript数组

3 个答案: