Dojo获取下拉框的文本和值实例代码


Posted in Javascript onMay 27, 2016

Dojo

Dojo是一个用javascript语言实现的开源DHTML工具包。它是在几个项目捐助基础上建立起来的(nWidgets,Burstlib,f(m)),这也是为什么叫它a"unified"toolkit的原因。Dojo的目标是解决开发DHTML应用程序遇到的那些,长期存在、历史问题(historical problems with DHTML)。跨浏览器问题。

1、问题背景

这里有一个下拉框,其中选项为一年四季,选中后打印下拉框的值和文本

2、实现源码

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8" /> 
<title>dojo-获取下拉框的值和文本</title> 
<link rel="stylesheet" href="js/dojo/dijit/themes/claro/claro.css" /> 
<script type="text/javascript" src="js/jquery-1.12.4.js"></script> 
<script type="text/javascript" src="js/dojo/dojo/dojo.js"></script> 
<style> 
#season{ 
width:200px; 
} 
</style> 
<script> 
dojoConfig={async:true,parseOnLoad:true} 
</script> 
<script> 
require([ 
"dojo/store/Memory", "dijit/form/FilteringSelect", "dojo/domReady!" 
], function(Memory, FilteringSelect){ 
var seasonStore = new Memory({ 
data: [ 
{name:"春季", id:"spring"}, 
{name:"夏季", id:"summer"}, 
{name:"秋季", id:"autumn"}, 
{name:"冬季", id:"winter"} 
] 
}); 
var seasonSelect = new FilteringSelect({ 
id: "season", 
name: "season", 
value: "spring", 
store: seasonStore, 
searchAttr: "name" 
}, "season").startup(); 
}); 
</script> 
</head> 
<body class="claro"> 
<input id="season" /><br> 
<button id="valueBtn" onclick="alert(dijit.byId('season').get('value'))">获取下拉框value</button> 
<button id="textBtn" onclick="alert(dijit.byId('season').get('displayedValue'))">获取下拉框text</button> 
</body> 
</html>

3、实现结果

(1)初始化时

(2)点击“获取下拉框value”按钮

(3)点击“获取下拉框text”按钮

Javascript 相关文章推荐
用Javascript实现锚点(Anchor)间平滑跳转
Sep 08 Javascript
JQuery 构建客户/服务分离的链接模型中Table分页代码效率初探
Jan 22 Javascript
js的alert弹出框出现乱码解决方案
Sep 02 Javascript
setTimeout()递归调用不加引号出错的解决方法
Sep 05 Javascript
浅谈js和css内联外联注意事项
Jun 30 Javascript
功能强大的Bootstrap效果展示(二)
Aug 03 Javascript
微信小程序 中wx.chooseAddress(OBJECT)实例详解
Mar 31 Javascript
老生常谈combobox和combotree模糊查询
Apr 17 Javascript
vue 组件中添加样式不生效的解决方法
Jul 06 Javascript
element-ui表格列金额显示两位小数的方法
Aug 24 Javascript
浅谈react-router@4.0 使用方法和源码分析
Jun 04 Javascript
一些可能会用到的Node.js面试题
Jun 15 Javascript
jQuery+Ajax+PHP弹出层异步登录效果(附源码下载)
May 27 #Javascript
js基于cookie方式记住返回页面用法示例
May 27 #Javascript
js获取客户端操作系统类型的方法【测试可用】
May 27 #Javascript
jQuery自定义图片缩放拖拽插件imageQ实现方法(附demo源码下载)
May 27 #Javascript
JS集成fckeditor及判断内容是否为空的方法
May 27 #Javascript
js实现div模拟模态对话框展现URL内容
May 27 #Javascript
详解jQuery中的deferred对象的使用(一)
May 27 #Javascript
You might like
php 用checkbox一次性删除多条记录的方法
2010/02/23 PHP
关于PHP中Session文件过多的问题及session文件保存位置
2016/03/17 PHP
PHP怎样用正则抓取页面中的网址
2016/08/09 PHP
PHP执行shell脚本运行程序不产生core文件的方法
2016/12/28 PHP
浅谈Yii乐观锁的使用及原理
2017/07/25 PHP
JavaScript写的一个自定义弹出式对话框代码
2010/01/17 Javascript
Javascript的getYear、getFullYear、getUTCFullYear异同分享
2011/11/30 Javascript
js导航菜单(自写)简单大方
2013/03/28 Javascript
通过正则表达式实现表单验证是否为中文
2014/02/18 Javascript
倒记时60刷新网页的js代码
2014/02/18 Javascript
简单谈谈javascript中的变量、作用域和内存问题
2015/08/30 Javascript
在js里怎么实现Xcode里的callFuncN方法(详解)
2016/11/05 Javascript
bootstrap jquery dataTable 异步ajax刷新表格数据的实现方法
2017/02/10 Javascript
解决使用Vue.js显示数据的时,页面闪现原始代码的问题
2018/02/11 Javascript
vue移动端实现下拉刷新
2018/04/22 Javascript
vue 路由嵌套高亮问题的解决方法
2018/05/17 Javascript
nodeJS进程管理器pm2的使用
2019/01/09 NodeJs
原生javascript中this几种常见用法总结
2020/02/24 Javascript
JS数组降维的实现Array.prototype.concat.apply([], arr)
2020/04/28 Javascript
[40:27]完美世界DOTA2联赛PWL S3 PXG vs GXR 第一场 12.19
2020/12/24 DOTA
在IIS服务器上以CGI方式运行Python脚本的教程
2015/04/25 Python
python获取程序执行文件路径的方法(推荐)
2018/04/26 Python
Python中的Django基本命令实例详解
2018/07/15 Python
从DataFrame中提取出Series或DataFrame对象的方法
2018/11/10 Python
法国创作个性化T恤衫和其他定制产品平台:Tostadora
2018/04/08 全球购物
100%植物性、有机、即食餐:Sakara Life
2018/10/25 全球购物
Bandier官网:奢侈、时尚前卫的健身服装首选目的地
2020/07/05 全球购物
应届生学校辅导员求职信
2013/11/07 职场文书
毕业自荐信
2013/12/16 职场文书
司仪主持词两篇
2014/03/22 职场文书
教师党员一句话承诺
2014/03/28 职场文书
个人工作表现评语
2014/04/30 职场文书
体育专业大学生职业生涯规划范文:打造自己的运动帝国
2014/09/12 职场文书
学习党的群众路线对照检查材料
2014/09/29 职场文书
中学感恩教育活动总结
2015/05/05 职场文书
mybatis 获取无数据的字段不显示的问题
2021/07/15 Java/Android