如何使用HTML5中的datalist并使用jquery获取值

 时间:2024-10-13 06:42:43

1、第一步,在HBuilder工具中,新建datalist.html静态页面;然后引入jquery核心文件,如下图所示:

如何使用HTML5中的datalist并使用jquery获取值

2、第二步,在<body></body>标签元素内,插入一个input和datalist标签,如下图所示:

如何使用HTML5中的datalist并使用jquery获取值

3、第三步,保存代码并在浏览器中,查看界面效果,可以发现类似一个下拉框,如下图所示:

如何使用HTML5中的datalist并使用jquery获取值

4、第四步,点击datalist标签,会发现出现下拉框中的选项,效果与下拉框一样,如下图所示:

如何使用HTML5中的datalist并使用jquery获取值

5、第五步,接着在<script></script>标签内,获取datalist标签的ID,获取change事件,如下图所示:

如何使用HTML5中的datalist并使用jquery获取值

6、第六步,再次保存代码并查看界面效果,并切换datalist标签元素,查看对应的值,如下图所示:

如何使用HTML5中的datalist并使用jquery获取值
  • 如何下载设置windows官方主题?windows主题?
  • php问卷调查怎么做
  • Python:怎么将队列对象中元素向右循环移动一步
  • 怎样获取datalist里面控件的值
  • Visio怎样设置形状三维旋转效果的样式
  • 热门搜索
    幼儿保育知识 什么样的路不能走 玉屏风散的功效与作用 牛初乳的功效与作用 初一数学知识点 吃海参的功效与作用 洋甘菊的功效与作用 曾几何时什么意思 安全知识小报 芡实的作用与功效