将图像与jQuery AutoComplete集成

所以我正在研究这个项目，我正在使用jQuery自动完成来显示来自mysql数据库的搜索结果。 搜索结果是从具有产品图像的数据库中提取的产品名称。 我如何才能显示产品图像，如下图所示？

这是我的jQuery自动完成页面：

 $( "#birds" ).autocomplete({ source: "search.php", minLength: 2, select: function( event, ui ) { log( ui.item ? "Selected: " + ui.item.value + " aka " + ui.item.label : "Nothing selected, input was " + this.actor ); window.location.href = './products/' + ui.item.productid; //window.location.href = 'product_display.php?id=' + ui.item.value; // document.testForm.action = "pretravel.php?id="+ui.item.value; //document.testForm.submit(); } }); });  

search.php中

 $row['productid'],'actor'=>$row['productname'])); //array_push($return,array('value'=>$row['productid'],'label'=>$row['productname'])); //array_push($return,array('actor'=>$row['productname'],'label'=>$row['productid'])); array_push($return,array('productid'=>$row['productid'],'label'=>$row['productname'])); } header('Content-type: application/json'); echo json_encode($return); //var_dump($return); exit(); // AJAX call, we don't want anything carrying on here } else { header('Location:index'); } ?> 

Answer 1

有一个你想要使用的名为_renderItem的方法。

这是一个正在使用的小型演示： http ： //jsbin.com/cunuxaqe/2/edit