动态添加option及createElement使用示例


Posted in Javascript onJanuary 26, 2014
<!DOCTYPE html> 
<html> 
<head> 
<title>select.html</title> <meta http-equiv="keywords" content="keyword1,keyword2,keyword3"> 
<meta http-equiv="description" content="this is my page"> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8"> 
<!--<link rel="stylesheet" type="text/css" href="./styles.css">--> 
</head> 
<body> 
<select id = "myCourse" onchange = "getCourse();"> 
<option value = "" selected>--请选择一门课程--</option> 
</select> 
<textarea id = "myares" rows="10" cols="30"></textarea> 
<script type="text/javascript" type = "text/javascript"> 
<!-- 
var last_select_num = 3;//加入从数据库中查询 
//动态添加第一门课程 
var myOption = document.createElement("option"); 
myOption.value = "java"; 
myOption.text = "java"; 
myCourse.add(myOption); 
//动态添加第二门课程、 
myOption = document.createElement("option"); 
myOption.value = "oracle"; 
myOption.text = "oracle"; 
myCourse.add(myOption); 
//动态添加第三门课程、 
myOption = document.createElement("option"); 
myOption.value = "javaEE"; 
myOption.text = "javaEE"; 
myCourse.add(myOption); 
function getCourse(){ 
myares.value += "你选择了:"+myCourse.value +"\r\n"; 
} 
--> 
</script> 
</body> 
</html>

动态添加option及createElement使用示例 
Javascript 相关文章推荐
离开当前页面前使用js判断条件提示是否要离开页面
May 02 Javascript
js验证身份证号有效性并提示对应信息
Oct 19 Javascript
Bootstrap编写一个兼容主流浏览器的受众巨幕式风格页面
Jul 01 Javascript
Bootstrap实现input控件失去焦点时验证
Aug 04 Javascript
jQuery dataTables与jQuery UI 对话框dialog的使用教程
Sep 02 Javascript
angular学习之ngRoute路由机制
Apr 12 Javascript
vue图片加载失败时用默认图片替换的方法
Aug 29 Javascript
微信小程序实现轨迹回放的示例代码
Dec 13 Javascript
jquery添加div实现消息聊天框
Feb 08 jQuery
javascript 设计模式之组合模式原理与应用详解
Apr 08 Javascript
Vue如何基于es6导入外部js文件
May 15 Javascript
解决VUE项目使用Element-ui 下拉组件的验证失效问题
Nov 07 Javascript
js和jquery使按钮失效为不可用状态的方法
Jan 26 #Javascript
js中创建对象的几种方式示例介绍
Jan 26 #Javascript
Jquery创建层显示标题和内容且随鼠标移动而移动
Jan 26 #Javascript
js加入收藏以及使用Jquery更改透明度
Jan 26 #Javascript
JS对象转换为Jquery对象示例
Jan 26 #Javascript
JavaScript原型链示例分享
Jan 26 #Javascript
JS设置获取cookies的方法
Jan 26 #Javascript
You might like
php smarty的预保留变量总结
2008/12/04 PHP
改写函数实现PHP二维/三维数组转字符串
2013/09/13 PHP
PHP在线调试执行的实现方法(附demo源码)
2016/04/28 PHP
Zend Framework入门教程之Zend_Session会话操作详解
2016/12/08 PHP
thinkPHP中U方法加密传递参数功能示例
2018/05/29 PHP
cssQuery()的下载与使用方法
2007/01/12 Javascript
Javascript 两个窗体之间传值实现代码
2009/09/25 Javascript
js各种验证文本框输入格式(正则表达式)
2010/10/22 Javascript
设置iframe的document.designMode后仅Firefox中其body.innerHTML为br
2012/02/27 Javascript
js实现的切换面板实例代码
2013/06/17 Javascript
JavaScript日期类型的一些用法介绍
2015/03/02 Javascript
javascript制作2048游戏
2015/03/30 Javascript
JQuery中Bind()事件用法分析
2015/05/05 Javascript
Bootstrap页面标题Page Header的实现方法
2017/03/22 Javascript
js实现不提示直接关闭网页窗口
2017/03/30 Javascript
JS使用正则表达式获取小括号、中括号及花括号内容的方法示例
2018/06/01 Javascript
Vue 自定义标签的src属性不能使用相对路径的解决
2019/09/17 Javascript
详解ES6 CLASS在微信小程序中的应用实例
2020/04/24 Javascript
python多线程用法实例详解
2015/01/15 Python
python实现指定字符串补全空格的方法
2015/04/30 Python
python实现植物大战僵尸游戏实例代码
2019/06/10 Python
python使用pip安装模块出现ReadTimeoutError: HTTPSConnectionPool的解决方法
2019/10/04 Python
python3 dict ndarray 存成json,并保留原数据精度的实例
2019/12/06 Python
关于keras中keras.layers.merge的用法说明
2020/05/23 Python
解决pip安装的第三方包在PyCharm无法导入的问题
2020/10/15 Python
python使用requests库爬取拉勾网招聘信息的实现
2020/11/20 Python
No module named ‘win32gui‘ 的解决方法(踩坑之旅)
2021/02/18 Python
The Hut德国站点:时装、家居用品、美容等
2016/09/23 全球购物
瑞贝卡·泰勒官方网站:Rebecca Taylor
2016/09/24 全球购物
新西兰最大的天然保健及护肤品网站:HealthPost(直邮中国)
2021/02/13 全球购物
就业协议书范本
2014/04/11 职场文书
公司投资建议书
2014/05/16 职场文书
见习期个人总结
2015/03/05 职场文书
字典算法实现及操作 --python(实用)
2021/03/31 Python
goland 清除所有的默认设置操作
2021/04/28 Golang
如何打开Win11系统注册表编辑器?Win11注册表编辑器打开修复方法
2022/04/05 数码科技