设为首页收藏本站展会信息天天打卡快捷登录设置
会员登录 注册帐号

Discuz!大师网

搜索
新闻
教程汇集 问题互助 插件推荐 建站素材 功能源码 模板风格
热门城市展会
北京 上海 天津 重庆 广州 深圳 南京 武汉
交流
网站地图 批量注册 批量发帖 虚拟人气 自由马甲 格子广告 蜘蛛统计 百度推送
分类
批量套餐 SEO套餐 个人专栏 打卡签到 搜索附件 链接格子
Discuz!大师网»站长社区 › 站长交流 › 编程技术 › 新的 HTML5 Datalist 元素
返回列表 发新帖
查看: 1720|回复: 0

新的 HTML5 Datalist 元素

[复制链接]
admin

TA的专栏

  • 打卡等级：小镇青年
  • 打卡总天数：60
  • 打卡月天数：1
  • 打卡总奖励：422
  • 最近打卡：2023-01-02 10:11:05
发表于 2012-6-19 13:06:47 | 显示全部楼层 |阅读模式

马上注册，结交更多好友，享用更多功能，让你轻松玩转社区。

您需要 登录 才可以下载或查看，没有账号？立即注册

x
HTML5 的 <datalist> 元素为 <input> 元素指定了一个预定义的列表选项，实现类似自动完成的效果。
  1. 01        <!DOCTYPE html>
  2. 02        <html>
  3. 03        <body>
  4. 04          
  5. 05        <form action="login.php" method="post">
  6. 06        User:
  7. 07        <input list="username" name="username" />
  8. 08        <datalist id="username">
  9. 09          <option value="Zhlmmc">
  10. 10          <option value="oschina">
  11. 11          <option value="Winter Lau">
  12. 12          <option value="Eddie">
  13. 13          <option value="Valentin">
  14. 14        </datalist>
  15. 15        Password:
  16. 16        <input type="password" />
  17. 17        <input type="submit" value="Login" />
  18. 18        </form>
  19. 19          
  20. 20        </body>
  21. 21        </html>
复制代码


<datalist> 标签当前只是 Firefox 和 Opera 浏览器支持，希望其他浏览器能尽快支持。

<datalist> 最终的运行效果如下：
HTML5
最近访问 头像模式列表模式

相关帖子
回复 马甲回复

使用道具 举报

返回列表 发新帖
高级模式
B Color Image Link Quote Code Smilies
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

QQ|网站地图|小黑屋|展会网|Discuz站长论坛 |天天打卡

GMT+8, 2024-4-23 18:24 , Processed in 0.025233 second(s), 7 queries , Gzip On, Redis On.

Powered by Discuz! X3.4

Copyright © 2001-2021, Tencent Cloud.

快速回复 返回顶部 返回列表