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 相关文章推荐
在 IE 中调用 javascript 打开 Excel 表
Dec 21 Javascript
jQuery 验证插件 Web前端设计模式(asp.net)
Oct 17 Javascript
JavaScript性能陷阱小结(附实例说明)
Dec 28 Javascript
JavaScript EasyPager 分页函数
May 25 Javascript
JavaScript 原型继承
Dec 26 Javascript
javascript实现依次输入input自动定焦
Dec 23 Javascript
详解vue项目构建与实战
Jun 27 Javascript
Node.js实现文件上传的示例
Jun 28 Javascript
vue实现组件之间传值功能示例
Jul 13 Javascript
JQuery中DOM节点的操作与访问方法实例分析
Dec 23 jQuery
微信小程序云函数添加数据到数据库的方法
Mar 04 Javascript
JavaScript获取时区实现过程解析
Sep 24 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
古巴咖啡 Cubita琥爵咖啡 独特的加勒比海风味咖啡
2021/03/06 新手入门
PHP4在WinXP下IIS和Apache2服务器上的安装实例
2006/10/09 PHP
php实现的简单压缩英文字符串的代码
2008/04/24 PHP
PHP中用hash实现的数组
2011/07/17 PHP
php对称加密算法示例
2014/05/07 PHP
php生成zip文件类实例
2015/04/07 PHP
PHP变量赋值、代入给JavaScript中的变量
2015/06/29 PHP
Yii2实现增删改查后留在当前页的方法详解
2017/01/13 PHP
html读出文本文件内容
2007/01/22 Javascript
基于jquery的DIV随滚动条滚动而滚动的代码
2012/07/20 Javascript
javascript实现的DES加密示例
2013/10/30 Javascript
javascript调试过程中找不到哪里出错的可能原因
2013/12/16 Javascript
jQuery 隐藏和显示 input 默认值示例
2014/06/03 Javascript
使用console进行性能测试
2015/04/27 Javascript
js中scrollTop()方法和scroll()方法用法示例
2016/10/03 Javascript
简单实现JS上传图片预览功能
2017/04/14 Javascript
js实现移动端编辑添加地址【模仿京东】
2017/04/28 Javascript
mac上配置Android环境变量的方法
2018/07/08 Javascript
Node.js JSON模块用法实例分析
2019/01/04 Javascript
CKeditor4 字体颜色功能配置方法教程
2019/06/26 Javascript
浅谈Vue static 静态资源路径 和 style问题
2020/11/07 Javascript
opencv与numpy的图像基本操作
2019/03/08 Python
PyQt5固定窗口大小的方法
2019/06/18 Python
Django rstful登陆认证并检查session是否过期代码实例
2019/08/13 Python
Python爬虫:将headers请求头字符串转为字典的方法
2019/08/21 Python
使用Django搭建web服务器的例子(最最正确的方式)
2019/08/29 Python
python字符串的拼接方法总结
2019/11/18 Python
浅析Python 多行匹配模式
2020/07/24 Python
6种非常炫酷的CSS3按钮边框动画特效
2016/03/16 HTML / CSS
世界上最大的冷却器制造商:Igloo Coolers
2019/07/23 全球购物
平面设计的岗位职责
2013/11/08 职场文书
机械设备与数控技术专业求职信
2014/08/10 职场文书
生日宴会家属答谢词
2015/09/29 职场文书
2016中学教师读书心得体会
2016/01/13 职场文书
解决sql server 数据库,sa用户被锁定的问题
2021/06/11 SQL Server
python实现简单聊天功能
2021/07/07 Python