Jquery получает правильное значение на основе установленного флажка

#javascript #jquery #checkbox

#javascript #jquery #флажок

Вопрос:

Я не могу заставить этот простой код работать. Я хочу получить значение из атрибута данных и на основе этого передать его в оповещение

http://jsfiddle.net/btL9C/

 $("input[type=checkbox]").change(function() {
     var section_list = $('.section').data('section_list');

     if ($(this).hasClass(section_list "_list")) {          
         alert(section_list);
     }
});
  

HTML:

 <input type="checkbox" data-section_list = "1" class="section 1_list">
<input type="checkbox" data-section_list = "2" class="section 2_list">
<input type="checkbox" data-section_list = "3" class="section 3_list">
  

Как я могу получить оповещение для отображения соответствующего значения data-section_list ?

Ответ №1:

Попробуйте это

 $("input[type=checkbox]").change(function() {

    var section_list = $(this).data().section_list;

   if ($(this).hasClass(section_list "_list")) {          
        alert(section_list);
   }
});
  

Комментарии:

1. использование ‘this’ в моем фактическом коде не определено, даже если настройка такая же, как та, которую я опубликовал

2. СКРИПКА я сделал то же самое. кажется, у меня все работает нормально

Ответ №2:

Попробуйте использовать $(this) ссылку при извлечении data из текущего элемента,

 $("input[type=checkbox]").change(function () {
    var section_list = $(this).data('section_list');
    if ($(this).hasClass(section_list   "_list")) {
        alert(section_list);
    }
}); //-- You have missed to mention the close parenthesis here.
  

ДЕМОНСТРАЦИЯ

Комментарии:

1. @Downvote: Не могли бы вы указать причину вашего голосования ..? чтобы я мог исправить ошибки, которые я допустил..

2. @sudharsan .это комедия, не принимайте всерьез. просто весело

3. @RajaprabhuAravindasamy и bala пожалуйста, удалите все комментарии, которые вы опубликовали

Ответ №3:

вам необходимо получить текущий атрибут данных элемента, на который вы нажимаете, используя this текущий, который вы используете $(".section") , который не даст желаемого результата, поскольку на странице с этим классом есть несколько элементов:

изменить:

 var section_list = $(".section").data('section_list');
  

Для:

 var section_list = $(this).data('section_list'); //<--- gets current cliked element data attribute
  

Ваш код будет выглядеть следующим образом:

 $("input:checkbox").change(function() {
     var section_list = $(this).data('section_list');

     if ($(this).hasClass(section_list "_list")) {          
         alert(section_list);
     }
});
  

ОБНОВЛЕННАЯ СКРИПКА

Ответ №4:

ДЕМОНСТРАЦИЯ

  1. Отсутствует последняя строка — change функция.
  2. Также используется $(this) для получения данных.

 $(document).ready(function(){
    $("input[type=checkbox]").change(function() {
         var section_list = $(this).data('section_list');

         if ($(this).hasClass(section_list "_list")) {          
             alert(section_list);
         }
    });  // <-- Missing
});
  

Комментарии:

1. 1. моя ошибка копирования. 2. это дает мне неопределенное значение для моего фактического кода, который настроен аналогично

2. @Gadgetster, вы включили ссылку на jQuery?

Ответ №5:

Вам нужно получить атрибут элемента, на который вы нажимаете

 $("input[type=checkbox]").change(function() {
     var section_list = $(this).attr('data-section_list');

     if ($(this).hasClass(section_list "_list")) {          
         alert(section_list);
     }
}
  

Комментарии:

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

2. это неправильный man — $(this).attr(‘data-section_list’); но я не поставил за вас, спасибо

3. почему это, является attr ( api.jquery.com/attr ) обесценился? Я знаю, что функция data используется для передачи информации, которая не обязательно задается как атрибут

Ответ №6:

Попробуйте это: используйте это вместо .раздел после функции изменения

 <script type="text/javascript">
$(document).ready(function() {

$("input[type=checkbox]").change(function() {
     var section_list = $(this).data('section_list');

     if ($(this).hasClass(section_list "_list")) {          
         alert(section_list);  
     }
});  
});  
</script> 
  

http://jsfiddle.net/btL9C/3/

Ответ №7:

Попробуйте это:-

 $("input[type=checkbox]").click( function(){
   if( $(this).is(':checked') ) alert($(this).attr("data-section_list"));
});