jquery オートコンプリートとカスタム html を使用して、ドロップダウンに画像を追加しようとしています。何らかの理由で、画像を設定すると、名前を入力するとオートコンプリートが正常に表示されます (画像とラベルは正常に表示されます)。 focus および select イベントには定義されていません。サンプル ページに示されている標準的な形式に従えば、すべて正常に動作します。
(jquery doc のもの - 期待どおりに動作します)
.append( "<a>" + item.label + "<br>" + item.value + "</a>" )
しかし、これを使用して画像を表示すると、オートコンプリート リストに写真が表示されますが、フォーカス イベントと選択イベントは機能しません
$( "#friends" ).autocomplete({
minLength: 2,
source: friend_data,
delay: 0,
autofocus: true,
focus: function(event, ui) {
$( "#friends" ).val( ui.item.label );
return false;
},
select: function( event, ui ) {
$( "#friends" ).val( ui.item.label );
return false;
}
})
.data( "autocomplete")._renderItem = function( ul, item ) {
var fb_pic_path = '<img src="http://graph.facebook.com/' + item.value + '/picture?type=square">' ;
console.log(fb_pic_path);
return $( "<li></li>" )
.data( "item.autocomplete", item )
.append( fb_pic_path + item.label )
.appendTo( ul );
};