如何在HTML元素屬性上存儲jquery對象？

Question

我有一個<select>表單元素，在其中基於遍歷對象的jQuery數組創建多個<option>子級。

我想將與<option>關聯的每個jQuery存儲在<option>本身上，我想作為一個屬性。 這樣，當我觸發change事件時，可以拉出<option>所基於的jQuery對象。

我以為我可以使用attr進行設置，將對象序列化為JSON，但無法正常工作。 有任何想法嗎？

這是一些代碼：

// creating the select: (data is a jquery array of objects)
    $(data).each(function() {
        var opt = $('<option></option>').val(this[id_property]).html(this[label_property]);
        // preserve the original jquery object on this <option> element:
        opt.attr('json', JSON.stringify(this));
        $(select).append(opt);
    });

// bind the onchange event, and try to recreate that original jquery object
    $(select).bind('change', function(event) {
        // this gives me a ref to the <option> element:
        var val = $(select).find(":selected");
        // now how to get the original jquery object?
        var item = $(val).attr('json');        
    });

我希望將var項目設置為原始jquery對象的最后一行-或以某種方式重新創建它。 我什至嘗試做一個eval()傳遞項目，因為它是JSON格式，但會引發錯誤。

Answer 1

您可以利用jQuery中的data()方法，這可能會為您帶來最有利的結果，並且使您能夠避免不必要的自定義序列化。