jquery - ドロップダウン内のオプションで $.data() を取得するには?

Question

$('#selectSurvey').append('<option value="1" data-img="/path/image.png">'+ Option1 +'</option>');

$('#selectSurvey').on('change',function(e){
    $('#image-here').attr('src',this.data('img')); //wrong
});

変更時にドロップダウン内のOption1のデータを取得するにはどうすればよいですか?

Answer 1

optionselect 要素から選択したものを取得してから、データを取得しようとします。

$('#selectSurvey').on('change',function(e){
  $('#image-here').attr('src',$(this).find('option:selected').data('img')); 
});

は ではなく 要素data-imgで設定されているため、 .optionselect

Answer 2

これを試すことができます：-

$('#selectSurvey').on('change',function(e){
   var img = $(this).find('option:selected').attr('data-img');
   $('#image-here').attr('src',img); 
});

または .data() を使用します (jQuery のバージョンが新しい、つまり >= 1.4.3 の場合)

$('#selectSurvey').on('change',function(e){
   var img = $(this).find('option:selected').data('img');
   $('#image-here').attr('src',img); 
});