Question

我想为我的文字字段做一些自动提示，使用此插件AutoSuggest jQuery Plugin

我有一个数组，已经是json_encoded，服务器上的文件，js，css，但我还没有得到示例如何工作，这里是我的代码，

<html>
 <head>
  <title>test-data</title>
   <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <link href="inc/css/admin_style.css" rel="stylesheet" type="text/css">
     <link href="inc/css/autoSuggest.css" rel="stylesheet" type="text/css">
     <script language="javascript" src="inc/js/functions.js"></script>
     <script language="javascript" src="inc/js/jquery-1.5.1.js"></script>
     <script language="javascript" src="inc/js/jquery.autoSuggest.js"></script>
     <script language="javascript" type="text/javascript">
      </script>
 </head>

 <body>
 <center><br><font class="title">test</font></center>

  <form action="dataAll.php" method="post">
   Name: <input type="text" name="fname" />
  <input type="submit" />
   </form>

   <p>&nbsp;</p>
  <p>JSON</p>
  <p>&nbsp;</p>
  <?php
  $encoded =  json_encode ($familyNames);
  echo $encoded;
   ?>
  </body>
  </html>

所以我应该把这段代码，

 $(function(){
 $("input[type=text]").autoSuggest(data);
 });

但问题是在哪里？（好像我把它放在php标签里面，它给我一个错误
我应该在哪里放置我的json格式化数组的名称？ “$ encoded”用于识别数据来源的函数？

非常感谢！

Answer 1

你把它放在html的标签里。

<script type="text/javascript">
 $(function(){
 $("input[type=text]").autoSuggest(data);
 });
</script>

Answer 2

你已经掌握了所有的东西，但是你的订单/方法有点偏。尝试创建第二个文件，名为ajax.php，并将所有PHP代码放在那里。为了确保输出良好的JSON，请在header('Content-Type: text/json; charset=ISO-8859-1');文件的最开头添加行ajax.php（您必须在发送任何输出之前设置标题，否则您将得到一个错误）。现在您必须请求您的建议数据：

$(document).ready(function() { // Runs when your page is loaded in the user's browser $.getJSON('ajax.php', function(data) { // Runs ajax.php, then executes an anonymous function to handle the response $('input[name="fname"]').autoSuggest(data); // Set your input field to use automatic suggestions with the returned data }); // end getJSON }); // end ready

此代码只执行ajax.php的异步HTTP请求，并将返回的JSON数据移交给自动建议的jQuery插件。将其放在<script type="text/javascript"></script>标记内。由于使用$(document).ready(...)，页面加载时会运行一次。我添加了小优化（input[name="fname"]），因此jQuery不会尝试将自动建议功能附加到您在页面上的每个文本输入。如果这就是你想要做的（不太可能），只需将其改回input[type=text]。

你真的不需要一个单独的php文件来实现这一点。没有什么可以阻止你在一个文件中完成这一切，但你很快就会意识到可以得到的混乱和无法管理。对我来说，最容易将我的“ajaxy”php代码视为我的Web应用程序的单个模块化部分。

请务必参考这些页面以获取详细信息：

http://api.jquery.com/

http://api.jquery.com/ready/

http://api.jquery.com/jQuery.getJSON/

关于autosuggest jquery插件的noob问题

2 个答案: