用于将选择框选项值设置为对象的代码

Question

在我有一个html页面,我有一个这样的选择框与值.

<select onChange="return filler(this.value);">
<option value="{'name':'rajiv',age:'40'}">a</option>
<option value="{'name':'mithun',age:'22'}">f</option>
</select>

我想传递一个javascript数组或对象作为选项值.现在它将选项值视为字符串.

我希望它是一个数组,以便我可以访问它

填充函数中的this.value.name,this.value.age.

这可能吗？

Answer 1

您将无法在value属性中存储对象/数组,但是一个选项是使用data-*jQuery 1.4.3+自动支持json的属性

<select>
    <option data-value='{"name":"rajiv","age":"40"}'>a</option>
    <option data-value='{"name":"mithun","age":"22"}'>f</option>
</select>

并使用 .change()

$("select").change(function(){
    alert($(this).find(":selected").data("value").age);
});

关于jsfiddle的例子

Answer 2

不,不只是那样.值必须是字符串.我强烈建议使用jQuerys .data()方法来保存Arrays或Objects在expando属性中使用.

如果它必须在值中,你只需要JSON解码(.parse)它:

var myValue = JSON.parse(this.value);

myValue.age; // 40
myValue.name // rajiv

但同样,我认为这不是一个好的解决方案.看看http://api.jquery.com/jQuery.data/ 此外,如果将JSON字符串放在任何data-HTML5属性中,jQuery将自动转换数组和对象.例如:

<option value="A" data-info="{'name':'rajiv',age:'40'}">something</option>

如果您现在使用jQuery访问该节点,我们会自动在其数据expando中获取该对象

$('option').data('info').name; // === rajiv

Answer 3

使用的时候可以通过parseJSON将字符串转成对象，但值必须是字符串。

  var option = $('select').val();
  var selected = $.parseJSON(option);
  alert( selected.name + ': ' + selected.age );