2015-06-03 31 views
1

我有一個小問題..我一直在研究JQuery自動完成系統,但我無法管理出現的盒子同時書寫消失。Autocompletion div不會消失[PHP/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代碼:當退格輸入http://prntscr.com/7cqbgc 打印屏幕:

<?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/7cqbsa

我希望有人可以幫助我使從數據庫中檢索到的項目消失。

另外,如果有人有線索。如果項目中的文本與我的文本輸入相匹配,我將如何使它們變爲粗體?

謝謝。

回答

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; 
} 
+0

感謝標記。祝你有美好的一天:):):)。你也可以投票。 –