2012-01-24 2 views
1

Я пытаюсь изменить класс все сНа элемента с идентификатором «LED1», который проживает в другом DIV с идентификатором 1.Изменения Подэлементы класс с JQuery

<div class="MACHINE"> 
    <div id="1" class="HOST">EMPTY 
    <div id="led1" class="LED"></div> 
    </div> 
</div> 

я использую следующий код, но это только измените текст «ПУСТОЙ», а не класс. Ниже приведен фрагмент моего файла js для изменения класса. По какой-то причине это не работает ...

Я надеюсь, что кто-то может направить меня в правильном направлении.

$.each(data, function(hst) { 
    $.each(data[hst], function(key, value){ 
     var currClass = $('#led'+ key).attr('class'); 
     switch(value) 
     { 
      case 'EMPTY': $('#led' + key).removeClass(currClass).addClass('LED ' + value);$('#' + key).html(value);break; 
      case 'PROCESSING': $('#led' + key).removeClass(currClass).addClass('LED ' + value);$('#' + key).html(value);break; 
      case 'FINISHED': $('#led' + key).removeClass(currClass).addClass('LED ' + value);$('#' + key).html(value);break; 
      case 'REPLACE': $('#led' + key).removeClass(currClass).addClass('LED ' + value);$('#' + key).html(value);break; 
     } 
     }); 
    }); 
    }, 
    error: function() { 
    alert('Ello'); 
    console.log("ERROR: show_host_status")  
    }, 
}); 
}, 
} 
+0

У вас есть элементы с тем же ID? –

+2

Идентификаторы a) не должны начинаться с числа и b) должны быть уникальными. «Я пытаюсь изменить класс всех элементов div с идентификатором« led1 »,« подразумевает, что у вас более одного. – j08691

ответ

1

Я вижу проблему.

case 'EMPTY': $('#led' + key).removeClass(currClass).addClass('LED ' + value);$('#' + key).html(value);break; 

Он устанавливает HTML-код HOST независимо от его значения (таким образом удаляя светодиод). Попробуйте что-то вроде этого.

<div class="MACHINE"> 
    <div id="1" class="HOST"> 
     <div class='host-value'>EMPTY</div> 
     <div id="led1" class="LED"></div> 
    </div> 
</div> 

и ваш код в формулировках случае, как

case 'EMPTY': $('#led' + key).removeClass(currClass).addClass('LED ' + value);$(".host-value", $('#' + key)).html(value);break; 

Тогда вы должны изменить способ получения «значение», поскольку его не только прямой элемент его от #key .host стоимости

+0

Nice !! Кажется, отлично работает! Tnx – Martijn

0

Как указано в других ответах, ответ технически:

ID and NAME tokens must begin with a letter ([A-Za-z]) and may be followed by any number of letters, digits ([0-9]), hyphens ("-"), underscores ("_"), colons (":"), and periods (".").

извинений: @dgvid

Попробуйте изменить <div id="1"> к <div id="host-1"> и обновить сценарий соответственно

+0

Я изменил ID на host1 и обновил свой сценарий соответственно, но не повезло ... – Martijn