2

我想从 php 数组中获取数据并将其显示在同一页面上。如何使用搜索框从 php 数组中导入数据。此代码无法正常工作。这段代码的错误是什么？

foodstore.js

var xmlHttp = createXmlHttpRequestObject();

function createXmlHttpRequestObject(){
    var xmlHttp;

    if(window.ActiveXObject){
        try{
            xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
        }catch(e){
              xmlHttp = false;
        }
    } else{
        try{
            xmlHttp = new XMLHttpRequest();
        }catch(e){
              xmlHttp = false;
        }
    }
    if(!xmlHttp)
        alert("cant create that object hoss!");
    else
        return xmlHttp;

}

function process(){
      if(xmlHttp.readyState==0|| xmlHttp.readyState==4){
            food = encodeURIComponent(document.getElementById("userInput").value);
            xmlHttp.open("GET","foodstore.php?food="+food,true);
            xmlHttp.onreadystatechange = handleServerResponse;
            xmlHttp.send(null);
      }else{
         setTimeout('process()',1000);

      }
}

function handleServerResponse(){
    if(xmlHttp.readyState==4){
         if(xmlHttp.status==200){
            xmlResponse = xmlHttp.responseXML;
            xmlDocumentElement = xmlResponse.documentElement;
            message = xmlDocumentElement.firstChild.data;
            document.getElementById("underInput").innerHTML ='<span style="color:blue">'+message+'</span>';
            setTimeout('process',1000);
         }else{
            alert('Something went wrong!');
         }
    }

 }

foodstore.php

<?php
   header('Content-Type: text/xml'); 
   echo '<?xml version="1.0" encoding="UTF-8" standalone="yes"?>';

echo '<response>';
   $food = $_GET['food'];
   $foodArray = array('tuna','bacon','beef','loaf','ham');
   if(in_array($food,$foodArray))
      echo 'We do have '.$food'!';
    elseif($food =='')
      echo 'Enter a food you want to buy';
    else
       echo 'Sorry we don't sell it '.$food'!';       

echo '</response>';

?>

索引.html

<html><head>
<script type="text/javascript" src="foodstore.js"></script>
</head>
<body onload="process()">
<h3>The foods  </h3>
Order your foods:
<input type="text" id="Userinput"></input>
<div id="underInput"></div>
</body>
</html>

如何通过搜索框搜索显示数组数据

4

1 回答 1

1

我已经使用 jquery 更改了代码，它很简单。你可以试试。

索引.html

    <html>
    <head>
        <script src="http://code.jquery.com/jquery-1.10.1.min.js"></script>
        <script>
            $(function()
            {
                $("#Userinput").keyup(function()
                {
                    process();
                });
                $("#Userinput").keydown(function()
                {
                    process();
                });

                $("#Userinput").focus(function()
                {
                    process();
                });
                $("#Userinput").change(function()
                {
                    process();
                });
            });

            function process() {
                var input_food = $("#Userinput").val();
                $.ajax({
                    type: "GET",
                    url: "foodstore.php",
                    data: {food: input_food},
                    success: function(message)
                    {
                        $("#underInput").html('<span style="color:blue">' + message + '</span>');
                    },
                    error: function()
                    {
                        $("#underInput").html('<span style="color:red">Some error occured</span>');
                    }
                });
            }
        </script>
    </head>
    <body >
        <h3>The foods  </h3>
        Order your foods:
        <input type="text" id="Userinput" ></input>
        <div id="underInput"></div>
    </body>
</html>

foodstore.php

    <?php

    if (!empty($_GET['food']))
    {
        $food = $_GET['food'];
        $foodArray = array('tuna', 'bacon', 'beef', 'loaf', 'ham');
        if (in_array($food, $foodArray))
            echo "We do have " . $food . "!";
        elseif ($food == '')
            echo "Enter a food you want to buy";
        else
            echo "Sorry we don't sell it " . $food . "!";
    }
    else
    {
        echo "Enter a food you want to buy";
    }
?>

如果您知道 jquery，我认为它很简单。并且 php 中有一个简单的错误，您没有转义（不要）中的额外单引号，所以我使用双引号作为 echo 语句。复制粘贴并告诉这是否是您想要的。有任何疑问可以问。

于 2013-08-10T08:48:20.950 回答