JQuery - Как создать объект, основанный на всех div в классе? - PullRequest
Новая
       11

JQuery - Как создать объект, основанный на всех div в классе?

0 голосов
/ 09 мая 2011

Когда документ готов, я пытаюсь создать объект для всех моих div (ов) в классе и назначил их на основе атрибута div 'id'.Вот мои коды, которые не работают, я не могу понять.

<div class="supercolor" >                       
   <div class="colordiv" id="#111111" style="background-color:#111111;">&nbsp;</div>
   <div class="colordiv" id="#222222" style="background-color:#222222;" >&nbsp;</div>                
   <div class="colordiv" id="#333333" style="background-color:#333333;">&nbsp;</div>
</div>

И в моем разделе сценариев. 

$(document).ready(function() {

   $('div.supercolor > div').each(function() {
      var color_object = { $(this).attr('id') : false }
   });
});

Спасибо

Ответы [ 2 ]

2 голосов
/ 09 мая 2011 
$(function() {

    var divObjects = $("div.supercolor > div").map(function(val) {
        return new DivObject(this.id);
    }).get();

});

function DivObject(id) {
    this.id = id; 
    ...
}

Это займет все ваши <div> и сопоставит их с объектами div.Вы можете передать данные от вашего индивидуального <div> как идентификатор и передать его конструктору.

Вам нужно вызвать .get(), чтобы получить массив.

[Edit] 

var testDiv = $.grep(divObjects, function(val) {
    val.id === "test"
})[0];

Этот фрагмент кода может показаться более знакомым, хотя 

var testDiv;
for (var i = 0, ii = divObjects.length; i < ii; i++) {
    var div = divObjects[i];
    if (div.id === "test") {
        testDiv = div;
        break;
    }
}
1 голос
/ 09 мая 2011

Если у вас нет веских причин хранить массив «DivObjects», я бы рассмотрел вопрос об изменении вашего подхода.

При загрузке страницы прикрепляйте обработчики щелчков к каждому цветному div, чтобы переключать «выбранный» класс в div (и удалять его из других). 

$("div.supercolor > div").click(function(){
    $(this).toggleClass('selected').siblings('.selected').removeClass('selected');
});

В любой момент вам нужно получить выбранный цвет (если он есть), выбрать цветную шкалу с помощью класса selected и получить его идентификатор: 

$("div.supercolor > div.selected").attr('id');

Это может не подходить в вашей ситуации, но это просто и эффективно.

...