用於將選擇框選項值設置為對象的代碼

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屬性中存儲對象/數組，但是可以選擇使用jQuery 1.4.3+自動支持json的data-*屬性

<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()方法的東西來保存expando屬性中的Arrays或Objects 。

如果它必須在值中，你只需要JSON解碼（.parse）它：

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

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

但同樣，我認為這不是一個好的解決方案。 看看http://api.jquery.com/jQuery.data/如果你把JSON字符串放在任何data- HTML5屬性中，jQuery會自動轉換Arrays和Objects。 例如：

<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 );