2010-11-16 3 views
0

Чтобы продемонстрировать, что я мог бы даже использовать атрибут Class в элементе elem, я попытался добавить атрибуты класса к параметрам элемента select на статической странице и это работает нормально. Я заметил, что не так много онлайн-ресурсов задокументировали это, поэтому я решил, что я бы прямо установил запись.Добавить класс в выбранную опцию элемента select

здесь является JQuery код пытается добавить класс к выбранной опции

ChangeDdlItemBG : function(obj, compLev) 
{ 
    var ddl = $(obj); 
    var index = ddl.attr('selectedIndex'); 
    switch(compLev) 
    { 
     case ComplianceLevel.Compliant : 
      $(ddl.attr('id') + ': selected').addClass('Compliant'); 
      break; 
     case ComplianceLevel.OtherThanSerious : 
      $(ddl.attr('id') + ': selected').addClass('OtherThanSerious'); 
      break; 
     case ComplianceLevel.Serious : 
      $(ddl.attr('id') + ': selected').addClass('Serious'); 
      break; 
     case ComplianceLevel.Critical : 
      $(ddl.attr('id') + ': selected').addClass('Critical'); 
      break; 
    } 
} 

var ComplianceLevel = 
{ 
    Compliant : function() { return 0; }, 
    OtherThanSerious : function() { return 1; }, 
    Serious : function() { return 2; }, 
    Critical : function() { return 3; }, 
}; 

Новой информации, я не нашел причину ничего СВЕРШИВШИМСЯ была простая ошибка в значении передается в течение compLev. Однако теперь он проходит через код для правильного случая и ничего не делает для цвета элемента.

+1

так что это не вопрос. – shoebox639

+0

Прошу прощения, это вопрос ... код, выложенный выше, не ведет себя так, как я ожидал. Классы имеют правило цвета фона, объявленное для изменения цвета фона выбранного элемента. Мне нужна обратная передача, чтобы показать это? –

+0

@Matthew Вам нужно запустить эту функцию в событии изменения элемента SELECT. В этом случае вам не нужно передавать ссылку на элемент, так как это значение относится к этому значению. –

ответ

1

Вы, безусловно, можете уменьшить избыточность.

Кроме того, вы должны перспективе его функции, для того, чтобы сравнить их возвращаемое значение с compLev:

function(obj, compLev) { 

    var optClass = ""; 

    switch (compLev) { 
    case ComplianceLevel.Compliant() : 
     optClass = 'Compliant'; 
     break; 
    case ComplianceLevel.OtherThanSerious() : 
     optClass = 'OtherThanSerious'; 
     break; 
    case ComplianceLevel.Serious() : 
     optClass = 'Serious'; 
     break; 
    case ComplianceLevel.Critical() : 
     optClass = 'Critical'; 
     break; 
    } 

    $(obj).find("option:selected").addClass(optClass).siblings().removeClass(); 

} 
+0

, чтобы идея заключалась в привязке события к избранному вязам, а затем выполнить изменения внутри функции обратного вызова? –

+0

также иметь в виду, я выполняю функции разметки в событии onchange для выбранного вяза. Я просто не думал, что это был необходимый код для публикации. –

+0

@Matthew Вы хотите, чтобы только выбранная опция имела набор классов? Или каждый вариант? –

0

Похоже, что у ваших селекторов есть опечатка. Если ddl.attr('id') не является типом элемента, ваш код не добавляет классов ни к чему. Я думаю, что вы хотите $('#' + ddl.attr('id') + ':selected')

+0

Я попробовал свой стиль изначально. Он создает исключение синтаксиса. –

Смежные вопросы