在日常的页面制作中，为了方便用户输入，经常可以在一个输入文本框中，当用户输入
内容时，自动下拉提示建议用户的输入，这叫autocomplete或者autosuggestion功能，
这样能加快用户的输入，目前的做法是通过ajax去实现，比如通过dwr等，这方面
的资料很多的。
而html5中，新增加了datalist这个标签，其实也是可以满足在前端达到
同样的功能，例子如下：
java代码
1. <input type="text" value="" list="fruits" />
2. <datalist id="fruits">
3. <option value="apple"></option>
4. <option value="orange"></option>
5. <option value="peach"></option>
6. </datalist>
这样的代码运行后，当用户在文本输入框输入内容时，就会下拉提示三种水果，
建议用户输入，如果担心兼容问题，可以尝试用如下代码：
java代码
1.
2. <datalist id="fruits">
3. pick your favorite fruit
4. <select name="fruit_sel">
5. <option value="apple">apple</option>
6. <option value="orange">orange</option>
7. <option value="peach">peach</option>
8. </select>
9. or type one.
10. </datalist>
11. <input type="text" name="fruit" value="" list="fruits" />
但这个情况下，记得服务端要同时捕捉fruits和fruit_sel两个参数了
datalist在firefox版本下一直都有的，这个赞扬一个，而其他版本浏览器
对其兼容情况，可以参考这个地址：
如对本文有疑问， 点击进行留言回复！！
我要评论
网友评论