Ссылка объекта JS на элемент DOM

Question

Как я могу ссылаться на конкретный элемент DOM на конкретный объект JS? Например, у меня есть множество клиентов. Используя jQuery, для каждого клиента я создаю LI с флажком и span для имени клиента. Когда флажок установлен, мне нужно выполнить некоторую обработку этого JS-объекта клиента. Вопрос в том, как мне легко получить этот объект JS. В настоящее время у меня есть следующее:

$(customers).each(function(){
$("<li>").append($("<input type=\"checkbox\"").attr("id","chk_" + this.ID)).append($("<span>").text(this.Name)).appendTo("#ulCustomers");
});

$("#ulCustomers input[type=checkbox]").bind("click",function(){

var customerId = $(this).attr("id").replace("chk_","");
var CustomerObj = $(customers).filter(function () { return this.ID == customerId }).get(0);

myProcess(CustomerObj); //Two above two lines are just for select correct customer from array.
});

Я верю в мир JS и jQuery существует более элегантный способ сделать это. Спасибо

Answer 1

Вы можете использовать jquery data function

$(customers).each(function() {
    var elem = $("<li><input type='checkbox'><span>" + this.Name + "</span></li>").appendTo("#ulCustomers");
    elem.find("input").data("customer", this);
});

$("#ulCustomers input[type=checkbox]").click(function() {
    var CustomerObj = $(this).data("customer");
    myProcess(CustomerObj);
});

Answer 2

Не могли бы вы привязать событие click к закрытию со ссылкой на соответствующий объект Customer?

как это

$(customers)
.each(function(){
    var custObj = this;
    $("<li>")
        .append(
            $("<input type=\"checkbox\"")
            .append($("<span>")
            .text(this.Name))
            .appendTo("#ulCustomers")
            .bind("click", function(){
                myProcess(custObj);
            })
});

Answer 3

Я бы использовал данные jQuery, вот так:

$ ("checkbox"). Data ('customer', this.ID);

Для получения данных:

$("#ulCustomers input[type=checkbox]").bind("onchange",function(){

var customerId = $(this).data("customer");
var CustomerObj = $(customers).filter(function () { return this.ID == customerId }).get(0);

myProcess(CustomerObj); //Two above two lines are just for select correct customer from array.
});

Кроме того, не использует событие click для флажков , использует событие onchange;)