js实现将选中值累加到文本框的方法


Posted in Javascript onAugust 12, 2015

本文实例讲述了js实现将选中值累加到文本框的方法。分享给大家供大家参考。具体如下:

这里实现JavaScript将列表框或单选框选中的值累计加入到文本框中,在一些表单中,我们经常会看到这种功能,可以免去用户输入的麻烦,提升用户体验。变通一下,你还可以做出更多的类似功能来。

运行效果截图如下:

js实现将选中值累加到文本框的方法

具体代码如下:

<html>
<head>
<title>js将选中值添加到文本框</title>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
oldvalue = "";
function passText(passedvalue) {
 if (passedvalue != "") {
  var totalvalue = passedvalue+"\n"+oldvalue;
  document.displayform.itemsbox.value = totalvalue;
  oldvalue = document.displayform.itemsbox.value;
 }
}
// End -->
</script>
</head>
<body>
<form name="selectform">
<select name="dropdownbox" size=1>
<option value="">请选择</option>
<option value="ASP">ASP</option>
<option value="PHP">PHP</option>
<option value="JAVA">JAVA</option>
<option value="ASP.NET">ASP.NET</option>
<option value="DELPHI">DELPHI</option>
</select>
<input type=button value="添加到列表中" onClick="passText(this.form.dropdownbox.options[this.form.dropdownbox.selectedIndex].value);">
</form>
<form name="displayform" >
<textarea cols="30" rows="5" name="itemsbox" ></textarea>
</body>
</html>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
一个JavaScript继承的实现
Oct 24 Javascript
JSQL 批量图片切换的实现代码
May 05 Javascript
js限制文本框输入长度两种限制方式(长度、字节数)
Dec 19 Javascript
JS修改css样式style浅谈
May 06 Javascript
jquery批量设置属性readonly和disabled的方法
Jan 24 Javascript
使用jquery菜单插件HoverTree仿京东无限级菜单
Dec 18 Javascript
JavaScript中的变量定义与储存介绍
Dec 31 Javascript
JS实现图片延迟加载并淡入淡出效果的简单方法
Aug 25 Javascript
浅谈JS的基础类型与引用类型
Sep 13 Javascript
Easyui在treegrid添加控件的实现方法
Jun 23 Javascript
关于webpack2和模块打包的新手指南(小结)
Aug 07 Javascript
详解微信小程序之一键复制到剪切板
Apr 24 Javascript
javascript实现简单的分页特效
Aug 12 #Javascript
JavaScript实现网站访问次数统计代码
Aug 12 #Javascript
jquery+ajax请求且带返回值的代码
Aug 12 #Javascript
javascript封装简单实现方法
Aug 11 #Javascript
基于Css3和JQuery实现打字机效果
Aug 11 #Javascript
js实现获取当前时间是本月第几周的方法
Aug 11 #Javascript
js判断子窗体是否关闭的方法
Aug 11 #Javascript
You might like
一个更简单的无限级分类菜单代码
2007/01/16 PHP
php二维数组用键名分组相加实例函数
2013/11/06 PHP
PHP将HTML转换成文本的实现代码
2015/01/21 PHP
PHP 魔术变量和魔术函数详解
2015/02/25 PHP
PHP使用缓存即时输出内容(output buffering)的方法
2015/08/03 PHP
详解php的socket通信
2015/08/11 PHP
php使用自定义函数实现汉字分割替换功能示例
2017/01/30 PHP
php类自动装载、链式操作、魔术方法实现代码
2017/07/23 PHP
IE innerHTML,outerHTML所引起的问题
2009/06/04 Javascript
javaScript(JS)替换节点实现思路介绍
2013/04/17 Javascript
Javascript中判断变量是数组还是对象(array还是object)
2013/08/14 Javascript
javascript同页面多次调用弹出层具体实例代码
2013/08/16 Javascript
jQuery实现购物车计算价格功能的方法
2015/03/25 Javascript
JavaScript实现图片瀑布流和底部刷新
2017/01/02 Javascript
Angular.js组件之input mask对input输入进行格式化详解
2017/07/10 Javascript
vue.js 中使用(...)运算符报错的解决方法
2018/08/09 Javascript
vue实现的上拉加载更多数据/分页功能示例
2019/05/25 Javascript
vue给对象动态添加属性和值的实例
2019/09/09 Javascript
Element-ui el-tree新增和删除节点后如何刷新tree的实例
2020/08/31 Javascript
[23:21]Ti4 冒泡赛第二轮DK vs C9 2
2014/07/14 DOTA
[03:45]Newbee战队出征西雅图 决战2016国际邀请赛
2016/08/02 DOTA
python调用短信猫控件实现发短信功能实例
2014/07/04 Python
Python正则抓取网易新闻的方法示例
2017/04/21 Python
Python数据结构与算法之二叉树结构定义与遍历方法详解
2017/12/12 Python
python 找出list中最大或者最小几个数的索引方法
2018/10/30 Python
python 读取更新中的log 或其它文本方式
2019/12/24 Python
python简单的三元一次方程求解实例
2020/04/02 Python
浅谈keras.callbacks设置模型保存策略
2020/06/18 Python
Python QT组件库qtwidgets的使用
2020/11/02 Python
使用python爬取抖音app视频的实例代码
2020/12/01 Python
python批量生成身份证号到Excel的两种方法实例
2021/01/14 Python
KTV的创业计划书范文
2014/02/02 职场文书
文明城市标语
2014/06/16 职场文书
关于运动会的宣传稿
2015/07/23 职场文书
职场中的你,辞职信写对了吗?
2019/06/26 职场文书
div与span之间的区别与使用介绍
2021/12/06 HTML / CSS