Установите флажок по классу и сделайте текст внутри жирным

0

После вызова ajax это то, как div заполняется списком пары (флажок, имя).

$.each(data, function(i, item) {
     $('#userListCheckBox').append(
       '<input type="checkbox" class="cbUser ' + item.IsApproved + 
       '" value="cb_' + item.UserId + '">' +
       item.FirstName + ' ' + item.LastName + '</input><br/>'
      );
    });

До появления только одобренных пользователей. Теперь каждый пользователь будет отображаться. Единственное различие заключается в том, что я хочу отобразить неактивного пользователя жирным шрифтом. Поэтому я добавил значение item.IsApproved в список классов.

Я пытаюсь сделать смелый текст внутри флажка, используя следующий код.

$('#userListCheckBox :checkbox .false').html().css('font-weight', 'bold');

но он не работает.

  • 0
    Флажки являются самозакрывающимися и не содержат текст. Вы можете добавить к нему элемент <label> и стилизовать его.
  • 0
    Между :checkbox и .false не должно быть .false если это один и тот же элемент
Показать ещё 5 комментариев
Теги:

1 ответ

2
Лучший ответ

У вас есть дополнительное место в вашем селекторе:

$('#userListCheckBox :checkbox.false').next("label").css('font-weight', 'bold');

Кроме того, input должен быть самозакрывающимся, вы должны обернуть текст в label и указать его.

$('#userListCheckBox').append(
   '<label><input type="checkbox" class="cbUser ' + item.IsApproved + 
   '" value="cb_' + item.UserId + '"/>' +
   item.FirstName + ' ' + item.LastName + '</label><br/>'
  );
});
Поделиться
  • 0
    Не забудьте атрибут for элемента label. Я думаю, мы могли бы установить атрибут id на флажок со значением item.UserId .
  • 0
    Или поместите input внутри label .
Показать ещё 2 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню