javascript - 自动完成 div 不会消失 [PHP/JQuery]

Question

我有一个小问题..我一直在研究 JQuery 自动完成系统，但我无法管理在写入时出现的框消失。

HTML代码:

<div class="content">
        <input type="text" class="search" id="searchid" placeholder="Search for items being sold.." />
        <div id="result"></div>
    </div>

JQuery 代码:

$(function(){
$(".search").keyup(function() 
{ 
var searchid = $(this).val();
var dataString = 'search='+ searchid;
if(searchid!='')
{
    $.ajax({
    type: "POST",
    url: "search.php",
    data: dataString,
    cache: false,
    success: function(html)
    {
    $("#result").html(html).show();
    }
    });
}return false;    
});

jQuery("#result").live("click",function(e){ 
    var $clicked = $(e.target);
    var $name = $clicked.find('.name').html();
    var decoded = $("<div/>").html($name).text();
    $('#searchid').val(decoded);
});
jQuery(document).live("click", function(e) { 
    var $clicked = $(e.target);
    if (! $clicked.hasClass("search")){
    jQuery("#result").fadeOut(); 
    }
});
$('#searchid').click(function(){
    jQuery("#result").fadeIn();
});
});

PHP 代码:

<?php
require_once('includes/db_connect.php');
if($_POST) {
    $q = $_POST['search'];
    $sql_res = mysqli_query($conn, "SELECT * FROM entries WHERE item like '%$q%'");

    while($row = mysqli_fetch_array($sql_res)) {
        $item = $row['item'];
    ?>
        <div class="show" align="left">
            <span class="name"><?=$item;?></span>
        </div>
    <?php
    }
}   
    ?>

输入时打印屏幕:http://prntscr.com/7cqbgc退格输入时打印屏幕:http://prntscr.com/7cqbsa

我希望有人能帮助我使从数据库中检索到的元素消失。

另外，如果有人有线索。如果元素中的文本与我的文本输入匹配，我该如何将其设为粗体？

谢谢。

Answer 1

就这样试试:-

if(searchid!='')
{
    $.ajax({
    type: "POST",
    url: "search.php",
    data: dataString,
    cache: false,
    success: function(html)
    {
      if(html !=''){ 
        $("#result").html(html).show();
      }else{
       $("#result").hide();
     }
    }
    });
}else{
    $("#result").hide();return false;
}