GET 功能在自动完成搜索脚本中不起作用答案

【问题标题】：GET function doesnt work in autocomplete search scriptGET 功能在自动完成搜索脚本中不起作用
【发布时间】：2014-03-01 22:11:14
【问题描述】：

我对此有疑问，我想将 1 个搜索结果传递给另一个，我曾经将它传递给 search.php，最后我通过自动完成搜索获得类别和子类别，当我输入固定 $ 时一切正常父母，但是当我想使用 get 时它不起作用

index.php:

<script type="text/javascript" src="jquery-1.8.0.min.js"></script>
<script type="text/javascript">
  $(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("#result").live("click", function(e)
    {
      var $clicked = $(e.target);
      if (! $clicked.hasClass("search"))
      {
        jQuery("#result").fadeOut();
      }
    });
    $('#searchid').click(function()
    {
      jQuery("#result").fadeIn();
    });
    $("#result").send(function()
    {
        $.get('search.php?result=' + $(this).val();)
    });
  });
</script>

<script type="text/javascript">
  $(function()
  {
    $(".search1").keyup(function()
      {
      var searchid1 = $(this).val();
      var dataString = 'search1='+ searchid1;
      if(searchid1!='')
      {
        $.ajax(
        {
          type: "POST",
          url: "search.php",
          data: dataString,
          cache: false,
          success: function(html)
          {
            $("#result1").html(html).show();
          }
        });
      }
      return false;
    });

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

<div class="content">
<input type="text" class="search" id="searchid" placeholder="e.g." />&nbsp; &nbsp;<br /> 
<div id="result">
</div>
</div>
<b>Channel's name:</b>
        <div class="content1">
<input type="text" class="search1" id="searchid1" placeholder="e.g." />&nbsp; &nbsp; <br /> 
<div id="result1">
</div>
</div>

搜索.php：

   <?php
include('db.php');
if (isset($_POST['search'])){
$pp=$_POST['search'];
$sql_rest=mysql_query("SELECT TABLE_SCHEMA, TABLE_NAME FROM information_schema.tables WHERE TABLE_SCHEMA = 'xdd' AND TABLE_NAME LIKE '%$pp%' LIMIT 5");
while($row=mysql_fetch_array($sql_rest))
{
$country=$row['TABLE_NAME'];
$b_country='<strong>'.$pp.'</strong>';

$final_country = str_ireplace($pp, $b_country, $country);

?>
<div class="show" align="left">
<span class="name"><?php echo "$final_country"; ?><br/>
</div>
<?php
}

}
if (isset($_POST['search1'], $_GET['result'])){
$parent = $_GET['result'];
$database = mysql_select_db('plavo_channels') or die(mysql_error());
$q=$_POST['search1'];
$sql_res=mysql_query("SELECT chann FROM $parent WHERE chann LIKE '%$q%' LIMIT 5");
while($row=mysql_fetch_array($sql_res))
{
$username=$row['channel'];

$b_username='<strong>'.$q.'</strong>';

$final_username = str_ireplace($q, $b_username, $username);

?>
<div class="show" align="left">
<span class="name"><?php echo $final_username; ?><br/>
</div>
<?php

}}
?>

我通常不做 ajax 和 jquery tnx 全部

【问题讨论】：

我使用 datalist 通过添加 list=test 到输入来进行自动完成并在页面末尾添加 <datalist id="listmodel"> 然后通过 jquery 和 ajax 现在刷新自动完成，如果这可以帮助你我会写例子
tnx 罗伯特，举个例子会很有帮助
抱歉太晚了，我现在写例子

标签： php jquery mysql ajax

【解决方案1】：

输入会是这样的

<form action method="POST">
  <input type="text" id="first" />
  <input type="text" id="second" list="list1"/>
  <input type="text" id="third" list="list2"/>
</form>

并将在最后添加到 html 页面

<datalist id="list1">
</datalist>
<datalist id="list2">
</datalist>

javascript会是这样的

$(document).ready( function(){
    $("#first").keyup(function(){
        first=$("#first");
        xmlhttp=new XMLHttpRequest();
        xmlhttp.open("GET","autocomplete.php?first="+first,false);
        xmlhttp.send();
        document.getElementById("list1").innerHTML=xmlhttp.responseText;    
    });
    $("#second").keyup(function(){
        first=$("#first");
        first=$("#second");
        xmlhttp=new XMLHttpRequest();
        xmlhttp.open("GET","autocomplete.php?first="+first+"&second="+second,false);
        xmlhttp.send();
        document.getElementById("list2").innerHTML=xmlhttp.responseText;    
    });
});

autocomplete.php 将是

<?php
if($_GET['first']&&$_GET['second'])
{
    // here list2
    echo"<option>option1</option>";
    echo"<option>option2</option>";
}
if($_GET['first'])
{
    //here list1
    echo"<option>option3</option>";
    echo"<option>option4</option>";
}
?>

但你会将选项更改为来自数据库

【讨论】：