多语言展示
当前在线:953今日阅读:91今日分享:37

如何利用EasyUI中ComboBox获取下拉值和文本

EasyUI插件中的ComboBox控件是select下拉框的一种,可以传值和传文本内容。可以根据需求,向后台传输值或者文本。下面利用一个实例作详细说明,具体操作如下:
工具/原料
1

EasyUI

2

HBuilder

3

截图工具

4

浏览器

5

jquery

6

HTML5

7

CSS3

方法/步骤
1

第一步,在HBuilder软件中创建web项目,并在web项目指定的目录下创建静态页面select.html,如下图所示:

2

第二步,引入EasyUI插件核心css和js文件,并引入jQuery核心js文件,如下图所示:

3

第三步,下面开始编写ComboBox容器,该控件利用的是select标签元素构成的,设置ComboBox样式,如下图所示:

4

第四步,第三步完成后在浏览器中进行预览,将会看到一个带有选项的下拉框,如下图所示:

5

第五步,编辑js代码,获取ComboBox选中的值和文本,利用getValue和getText方法分别获取值和文本,如下图所示:

6

第六步,再次预览页面,并单击“获取下拉框值”按钮,这时页面会弹出选中的序号和文本值,如下图所示:

注意事项
1

了解EasyUI中的ComboBox的用法

2

熟悉ComboBox常用的属性、方法和事件

推荐信息