如何进行自动完成文本输入(列表)? [英] How to make Auto Complete Text Input (List)?

查看:57
本文介绍了如何进行自动完成文本输入(列表)?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想像列表一样制作自动完整文本输入,它与下面图片中facebook的表单发布状态相似或相同,我知道它可以通过ajax和jQurey制作,所以谁知道链接演示,链接指南,或者说它的例子,可以分享给我参考,谢谢你的帮助。

这是示例图片

http:// i1095.photobucket.com/albums/i472/OLAKEN91/as_zpsd4476364.png

I want to make a Auto Complete Text Input like a list, it similar or the same as form post status of facebook in below picture, I known it can make by ajax and jQurey, so who know link demo, link guide, or example to make it, may be share for me to make reference, thank for help.
Here is example picture
http://i1095.photobucket.com/albums/i472/OLAKEN91/as_zpsd4476364.png

推荐答案

你应该试试jQuery UI的自动填充 [ ^ ]框。如果你去那个网站,你会发现自动完成的基本工作以及如何在你的网站上实现它。



您可以使用此代码为输入元素创建自动完成功能。像这样,



You should try out jQuery UI's Autocomplete[^] box. If you go to that website, you will find the basic working of Autocomplete and how you can implement it in your website.

You can use this code to create the autocomplete feature for an input element. Like this,

var availableTags = [
      "ActionScript",
      "AppleScript",
      "Asp",
      "BASIC",
      "C",
      "C++",
      "Clojure",
      "COBOL",
      "ColdFusion",
      "Erlang",
      "Fortran",
      "Groovy",
      "Haskell",
      "Java",
      "JavaScript",
      "Lisp",
      "Perl",
      "PHP",
      "Python",
      "Ruby",
      "Scala",
      "Scheme"
];


#tags)。自动完成({
来源:availableTags
});
( "#tags" ).autocomplete({ source: availableTags });





这是一个硬编码的可用标签字符串,您可以以某种方式调用从数据库或其他来源获取动态数据。然后在此变量中使用它们,自动完成将标记项目。您也可以使用Ajax来获取数据。



CSS样式可以应用于HTML以用于不同的设计。他们的网站上有一个测试,在那里检查。



This was a hardcoded string of available tags, you can somehow call to get the dynamic data from database or some other source. Then use them inside this variable from where the autocomplete would tag the items. You can use Ajax to get the data too.

CSS styling can be applied to the HTML for a different design. A test is present on their website, check it own there.


这个代码你可以在http://jqueryui.com/autocomplete找到但感谢帮助
Oh this code you find in http://jqueryui.com/autocomplete but thank for help


这篇关于如何进行自动完成文本输入(列表)?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆