2017-09-16 68 views
0

我使用php,mysql,js和ajax創建搜索功能。但我不能選擇搜索項目。我試圖選擇建議的單詞。有負載的建議,但我不能選擇它們。這裏是我創建的代碼。請使用我無法選擇搜索項目

這是索引頁。在索引頁腳本部分是錯誤的或者不工作fadeOut效果的最後部分。

<head> 
    <title>2nd year group project</title> 
    <meta charset = "utf-8"> 
    <metaname="viewport" content="width=device-width, initial-scale=1"> 

    <!--this is for link css file--> 
    <link rel="stylesheet" type="text/css" href="css/FindAProffesional.css"> 

    <!--//this is for link icons for site--> 
    <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css"> 

    <!--//this is for link bootstrap to site--> 
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"> 
    <script type="text/javascript" src="js/jquery-3.1.1.min.js"></script> 
    <script type="text/javascript" src="js/bootstrap.min.js"></script> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script> 
</head> 
<body> 
<div style="width:500px;"> 
<input type="text" name="country" id="country" class="form-control" placeholder="Enter city name"> 
</div> 
<div id="countryList"></div> 
<script> 
    $(document).ready(function(){ 
     $('#country').keyup(function(){ 
     var query = $(this).val(); 
     if(query!='') 
     { 
      $.ajax({ 
      url:"search.php", 
      method:"POST", 
      data:{query:query}, 
      success:function(data) 
     { 
     $('#countryList').fadeIn(); 
     $('#countryList').html(data); 
     } 
     }); 
     } 
    }); 

     $document().on('click','li',function(){ 
     $('#country').val($(this).text()); 
     $('#countryList').fadeOut(); 
     }); 
    }); 
</script> 
</body> 

這是serch.php頁

<?php 
    require('dbcon.php'); 
    if(isset($_POST["query"])) 
    { 
     $output=''; 
     $query ="SELECT DISTINCT city FROM architect WHERE city LIKE '%".$_POST["query"]."%'"; 
     $result = mysqli_query($conn,$query); 
     $output = '<ul class="list-unstyled">'; 
     if(mysqli_num_rows($result) > 0) 
     { 
      while($row = mysqli_fetch_array($result)) 
      { 
       $output .='<li>'.$row["city"].'</li>'; 
      } 
     } 
     else 
     { 
      $output .='<li>City not Found</li>'; 
     } 
     $output .='</ul>'; 
     echo $output; 

    } 
?> 
+0

很難準確地瞭解你需要什麼。您需要PHP或html/js/jquery部分的幫助嗎?要測試PHP,只需使用$ _REQUEST而不是$ _POST,然後將查詢作爲GET發送到新選項卡http://yourdomain/search.php?query = XXX – heXer

+0

php沒有問題,問題在腳本部分。我無法在搜索時選擇suggetions –

+0

什麼是'$ document()'? – Twisty

回答

2

更換

$document().on('click','li',function(){ 
     $('#country').val($(this).text()); 
     $('#countryList').fadeOut(); 
     }); 

$(function(){ 
    $('#countryList').on('click','li',function(){ 
    $('#country').val($(this).text()); 
    $('#countryList').fadeOut(); 
    }); 
}); 
+0

打我吧!發佈問題的答案是肯定的,人們應該意識到這隻適用於'click'事件。如果用戶使用鼠標滾動或箭頭,它將無法工作。 – Twisty

+0

現在工作。謝謝你,朋友 –