Javascript 如何根据1个输入自动完成并显示2-3个其他输入的信息_Javascript_Php_Jquery_Sql_Ajax

Javascript 如何根据1个输入自动完成并显示2-3个其他输入的信息

javascript php jquery sql ajax

Javascript 如何根据1个输入自动完成并显示2-3个其他输入的信息,javascript,php,jquery,sql,ajax,Javascript,Php,Jquery,Sql,Ajax,我想创建一个自动完成函数，如下所示：。如果你愿意，你可以自己试试代码：10001001我已经完成了自动完成。例如，如果我输入Pa它建议Paris我需要帮助的地方就在这里：如果我在输入1中的建议下单击Paris，我想完成输入2中的状态：比如说France。在输入3Europe中。以下是我的文件autocomplete.php中的代码： <html> <head> <script type="text/javascript" src

我想创建一个自动完成函数，如下所示：。如果你愿意，你可以自己试试代码：10001001
我已经完成了自动完成。例如，如果我输入

Pa

它建议

Paris

我需要帮助的地方就在这里：如果我在输入1中的建议下单击Paris，我想完成输入2中的状态：比如说

France

。在输入3

Europe

中。以下是我的文件autocomplete.php中的代码：

<html>
   <head>
        <script type="text/javascript"
        src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
        <script type="text/javascript"
        src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
        <link rel="stylesheet" type="text/css"
        href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" />

        <script type="text/javascript">
                $(document).ready(function(){
                    $("#name").autocomplete({
                        source:'getautocomplete.php',
                        minLength:1

                    });
                });
        </script>




        </script>
   </head>

   <body>

      <form method="post" action="">
            <input type="text" id="name" name="name" />
      </form>

      <form method="post" action="">
            <input type="text" id="client" name="client" />
      </form>

   </body>
<html>

有什么想法吗？谢谢你的帮助

我遇到了这个问题，我的解决方案是，我向autocomplete source添加了更多属性，在您的情况下，您必须添加更多属性，如state或php中的其他属性，如下所示：

while($student=mysql_fetch_array($query)){
     $json[]=array(
                'value'=> $student["proNum"],
                'label'=>$student["proNum"],
                'state'=>$student["state"],
                'any_param'=>$student["any_param"]
                    );
}

在javascript自动完成选择事件中，您可以获得以下属性：

$("#tags").autocomplete({
source: dataSearch,
select: function(event, ui) {
   alert(ui.item.state);//will alert you the state
       console.log(ui.item); //to view all properties of the selected item 
}
 });

$("#tags").autocomplete({
source: dataSearch,
select: function(event, ui) {
   alert(ui.item.state);//will alert you the state
       console.log(ui.item); //to view all properties of the selected item 
}
 });