Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/452.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 使用AJAX进行实时搜索_Javascript_Php_Ajax_Search - Fatal编程技术网

Javascript 使用AJAX进行实时搜索

Javascript 使用AJAX进行实时搜索,javascript,php,ajax,search,Javascript,Php,Ajax,Search,我需要建立一个实时搜索,但我不太了解ajax和javascript,但我了解html、css和php。有人能告诉我我做错了什么吗 <script> function liveSearch(str) { if (str == "") { document.getElementById("txtHint").innerHTML = ""; return; } else {

我需要建立一个实时搜索,但我不太了解ajax和javascript,但我了解html、css和php。有人能告诉我我做错了什么吗

<script>
    function liveSearch(str) {
        if (str == "") {
            document.getElementById("txtHint").innerHTML = "";
            return;
        }
        else { 
            if (window.XMLHttpRequest) {
                // code for IE7+, Firefox, Chrome, Opera, Safari
                xmlhttp = new XMLHttpRequest();
            }
            else {
                // code for IE6, IE5
                xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
            }

            xmlhttp.onreadystatechange = function() {
                if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                    document.getElementById("txtHint").innerHTML = xmlhttp.responseText;
                }
            }

            xmlhttp.open("GET", "getuser.php?q=" + str, true);
            xmlhttp.send();
        }
    }
</script>

<input type="text" onkeypress="liveSearch(this.name)" name="searchWord"/>

<?php
    $dbhost = 'localhost';
    $dbuser = 'root';
    $dbpass = '';
    $dbname = 'ezcart';
    $conn = new mysqli($dbhost, $dbuser, $dbpass, $dbname);

    if ($conn->connect_error) {
        die('Could not connect to the database: ' . $conn->connect_error);
    }

    $word = $_GET['q'];
    $sql= "SELECT prodNam FROM product WHERE prodNam LIKE '$q' ORDER BY prodNam ASC";
    $result = $conn->query($sql);

    if ($result->num_rows > 0) {
        while($row = $result->fetch_assoc()) {
            echo "<div><p>".$row[prodNam]."</p></div>";
        }
    }
    $conn->close();
?>

函数liveSearch(str){
如果(str==“”){
document.getElementById(“txtHint”).innerHTML=“”;
返回;
}
否则{
if(window.XMLHttpRequest){
//IE7+、Firefox、Chrome、Opera、Safari的代码
xmlhttp=新的XMLHttpRequest();
}
否则{
//IE6、IE5的代码
xmlhttp=新的ActiveXObject(“Microsoft.xmlhttp”);
}
xmlhttp.onreadystatechange=函数(){
if(xmlhttp.readyState==4&&xmlhttp.status==200){
document.getElementById(“txtHint”).innerHTML=xmlhttp.responseText;
}
}
open(“GET”、“getuser.php?q=“+str,true”);
xmlhttp.send();
}
}
更改查询

$word = $_GET['q'];

$sql= "SELECT prodNam FROM product WHERE prodNam LIKE '%".$word."%'";

有关更多信息:

首先,您需要在输入中生成一个“onkeyup”事件来调用javascript函数

例如:

 <input id="search" name="search" type="text" class="form-control" placeholder="Busca alguna empresa" onkeyup="dinamic(this.value)" autocomplete="off"/>
}

让我们来看看php:

<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = '';
$dbname = 'ezcart';
$conn = new mysqli($dbhost, $dbuser, $dbpass, $dbname);

if ($conn->connect_error) {
    die('Could not connect to the database: ' . $conn->connect_error);
}

$word = $_POST['cadena'];
$sql= "SELECT prodNam FROM product WHERE prodNam LIKE '%".$word."%' ORDER BY prodNam ASC";
$result = $conn->query($sql);

if ($result->num_rows > 0) {

    while($row = $result->fetch_assoc()) {
        echo "<div><p>".$row[prodNam]."</p></div>";
    }
}
$conn->close();

就我个人而言,我会使用Jquery和
$.get
$.post
功能,因为它们正是为这类事情而设计的,而且(在我看来)更简单、更清晰。我不能使用Jquery,这是为了一个单元的课程作业。你有
onkeypress=“liveSearch(this.name)”
,它会发送
搜索词。我想您希望
onkeypress=“liveSearch(this.value)”
发送文本框的值。我们是否假设您的php代码位于
getuser.php
中?(1) 您的var是
$word
->
$word=$\u GET['q']
,但您的查询中有
$q
,>
类似于“$q”
。(2) 此外,您可能需要将通配符
%
添加到查询值->
。。。像“%$word%”……
。(3) 您应该清理您的用户数据->
$word=$mysqli->real\u escape\u字符串($\u GET['q'])你有什么问题?
function dinamic(cadena) { //here cadena is your input value
var min = 3;
if (cadena.length >= min) { // true when the typed value have 3 or more characters
    $.ajax({
        type: 'POST',  //method to pass the information to live_search.php
        url: 'live_search.php',
        data: 'cadena=' + cadena, //name of the post variable
        success: function (respuesta) { 
            $('#resultados').html(respuesta); //place to write results
        }
    });
}
if (cadena.length>min) { //will show or not the table depending on the input value
    document.getElementById('resultados').className = 'table';
} else
    document.getElementById('resultados').className += ' hidden';
<?php
$dbhost = 'localhost';
$dbuser = 'root';
$dbpass = '';
$dbname = 'ezcart';
$conn = new mysqli($dbhost, $dbuser, $dbpass, $dbname);

if ($conn->connect_error) {
    die('Could not connect to the database: ' . $conn->connect_error);
}

$word = $_POST['cadena'];
$sql= "SELECT prodNam FROM product WHERE prodNam LIKE '%".$word."%' ORDER BY prodNam ASC";
$result = $conn->query($sql);

if ($result->num_rows > 0) {

    while($row = $result->fetch_assoc()) {
        echo "<div><p>".$row[prodNam]."</p></div>";
    }
}
$conn->close();