.data() JQuery возвращает undefined

Question

im работает с моим первым webapp, Im использует ajax-анализируемый объект для добавления динамического содержимого в один конкретный .html ... при этом я обнаружил проблему с добавлением атрибута data- * для каждого в раскрывающемся списке выбора ... когда функция изменения из JQuery выполняется, она возвращает undefined.

Вот моя функция ajax, (я знаю, что это не лучший способ сделать это).

ajaxPost("link/x.php",{},function(result){ 
      var json=JSON.parse(result); 
      var resultado=json.response; 
      if(json.error==0){ 
      var estadosString='<option value=""></option>'; 
      var cont=0; 
       for(estado in resultado){ 
        estadosString+=('<option value="'+resultado[estado].nombre+'">'+resultado[estado].nombre+'</option>'); 
       } 
       $('#estados').html(estadosString); 
       cont=0; 
       $('#estados option').each(function(){ 
        $(this).attr('data-id',cont); 
        $(this).data('id',cont++); 

       }); 

      }else{ 
       alert("No hay estados"); 
      } 
     }); 

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

$('#estados').on('change',function(){ 
      alert($(this).data("id")); 

     }); 

Он всегда возвращается не определенно, любой может мне помочь? Благодаря..!

Answer 1

Значение this в этом обработчике «change» будет <select> элемент, а не <option>, на котором он установлен. Элемент опции можно найти с помощью свойства select элемента selectedIndex или через jQuery.

Невозможно также установить атрибуты «идентификатор данных»; просто установите значение через .data().