使用JQuery進行PHP / MySQL實時搜索

Question

我有這個HTML廣告jquery代碼

<table width="100%" border="0">
  <tr>
    <td>Search: <input type="text" name="search" id="search" /> <input type="submit" id="SearchGo" value="Search" /> <input type="reset" name="reset" value="Clear" /></td>
  </tr>
</table>

<div id="result"></div>

<script type="text/javascript">
$(function(){
$('input#SearchGo').on('click', function(){
var searchid = $('input.search').val();
var dataString = 'search='+ searchid;
if(searchid!='')
{
    $.ajax({
    type: "POST",
    url: "tickets.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();
});
});
</script>

我想擁有實時搜索功能，因此當我單擊“提交”按鈕時，頁面不會重新加載。

此代碼在我的tickets.php頁面上（與帖子頁面相同）

在tickets.php上，我具有以下內容：

if($_POST) {
    //run search query
} else {
    //run normal select query
}

但沒有結果顯示

Answer 1

您的if語句很可能失敗。 您可以檢查字符串是否包含字符（非空）

if ($.trim(searchid).length > 0)

Answer 2

更改

<input type="submit" id="SearchGo" value="Search" />

至

<input type="button" id="SearchGo" value="Search" />

...和：

var searchid = $('input.search').val();

至：

var searchid = $('input#search').val();