动态添加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 相关文章推荐
你真的了解JavaScript吗?
Feb 24 Javascript
JavaScript 原型继承之构造函数继承
Aug 26 Javascript
js判断FCKeditor内容是否为空的两种形式
May 14 Javascript
jquery图片轮播插件仿支付宝2013版全屏图片幻灯片
Apr 03 Javascript
jQuery中[attribute^=value]选择器用法实例
Dec 31 Javascript
jQuery判断对象是否存在的方法
Feb 05 Javascript
JavaScript中数据结构与算法(二):队列
Jun 19 Javascript
js利用正则表达式检验输入内容是否为网址
Jul 05 Javascript
jquery——九宫格大转盘抽奖实例
Jan 16 Javascript
ThinkPHP+jquery实现“加载更多”功能代码
Mar 11 Javascript
js中值引用和地址引用实例分析
Jun 21 Javascript
jquery实现的放大镜效果示例
Feb 24 jQuery
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与SQL注入攻击[三]
2007/04/17 PHP
destoon在360浏览器下出现用户被强行注销的解决方法
2014/06/26 PHP
阻止JavaScript事件冒泡传递(cancelBubble 、stopPropagation)
2007/05/08 Javascript
兼容IE与firefox火狐的回车事件(js与jquery)
2010/10/20 Javascript
各浏览器对link标签onload/onreadystatechange事件支持的差异分析
2011/04/27 Javascript
jQuery中将函数赋值给变量的调用方法
2012/03/23 Javascript
有关javascript的性能优化 (repaint和reflow)
2013/04/12 Javascript
setInterval计时器不准的问题解决方法
2014/05/08 Javascript
Js实现滚动变色的文字效果
2014/06/16 Javascript
JS按回车键实现登录的方法
2014/08/25 Javascript
利用Node.js制作爬取大众点评的爬虫
2016/09/22 Javascript
JavaScript函数基础详解
2017/02/03 Javascript
详解Node.js利用node-git-server快速搭建git服务器
2017/09/27 Javascript
Vue中如何实现proxy代理
2018/04/20 Javascript
jQuery Ajax实现Select多级关联动态绑定数据的实例代码
2018/10/26 jQuery
vue权限管理系统的实现代码
2019/01/17 Javascript
Vue2.x通用编辑组件的封装及应用详解
2019/05/28 Javascript
使用layui前端框架弹出form表单以及提交的示例
2019/10/25 Javascript
vue 实现通过vuex 存储值 在不同界面使用
2019/11/11 Javascript
js重写alert事件(避免alert弹框标题出现网址)
2020/12/04 Javascript
Python实现把xml或xsl转换为html格式
2015/04/08 Python
python语言使用技巧分享
2016/05/31 Python
python3 图片referer防盗链的实现方法
2018/03/12 Python
python实现微信自动回复功能
2018/04/11 Python
在python3中pyqt5和mayavi不兼容问题的解决方法
2019/01/08 Python
PyQt5 窗口切换与自定义对话框的实例
2019/06/20 Python
python中metaclass原理与用法详解
2019/06/25 Python
Pandas 解决dataframe的一列进行向下顺移问题
2019/12/27 Python
python使用scapy模块实现ARP扫描的过程
2021/01/21 Python
Html5实现单张、多张图片上传功能
2019/04/28 HTML / CSS
计算机专业学生求职信分享
2013/12/15 职场文书
论文诚信承诺书
2014/05/23 职场文书
体育专业自荐书
2014/05/29 职场文书
英文自荐信范文
2015/03/25 职场文书
2015年校本培训工作总结
2015/07/24 职场文书
漫画「古见同学有交流障碍症」第25卷封面公开
2022/03/21 日漫