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 DOM 添加事件
Feb 14 Javascript
不用构造函数(Constructor)new关键字也能实现JavaScript的面向对象
Jan 11 Javascript
jquery使用each方法遍历json格式数据实例
May 18 Javascript
jquery实现点击弹出带标题栏的弹出层(从右上角飞入)效果
Sep 19 Javascript
jQuery插件formValidator自定义函数扩展功能实例详解
Nov 25 Javascript
深入理解jQuery之事件移除
Jun 02 Javascript
javascript另类方法实现htmlencode()与htmldecode()函数实例分析
Nov 17 Javascript
利用C/C++编写node.js原生模块的方法教程
Jul 07 Javascript
JS 实现banner图片轮播效果(鼠标事件)
Aug 04 Javascript
jQuery实现文字超过1行、2行或规定的行数时自动加省略号的方法
Mar 28 jQuery
Vue2 轮播图slide组件实例代码
May 31 Javascript
Vue项目打包编译优化方案
Sep 16 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
PHP实现即时输出、实时输出内容方法
2015/05/27 PHP
php 问卷调查结果统计
2015/10/08 PHP
PHP新建类问题分析及解决思路
2015/11/19 PHP
PHP7新增运算符用法实例分析
2016/09/26 PHP
PHP下的浮点运算不准的解决方法
2016/10/27 PHP
如何在父窗口中得知window.open()出的子窗口关闭事件
2013/10/15 Javascript
jquery中获得元素尺寸和坐标的方法整理
2014/05/18 Javascript
HTML5实现留言和回复页面样式
2015/07/22 Javascript
基于jQuery Circlr插件实现产品图片360度旋转
2015/09/20 Javascript
require.js的用法详解
2015/10/20 Javascript
window.onerror()的用法与实例分析
2016/01/27 Javascript
浅析Javascript ES6新增值比较函数Object.is
2016/08/24 Javascript
Three.js快速入门教程
2016/09/09 Javascript
JS实现的数字格式化功能示例
2017/02/10 Javascript
Vue.js实现在下拉列表区域外点击即可关闭下拉列表的功能(自定义下拉列表)
2017/05/30 Javascript
详解JS构造函数中this和return
2017/09/16 Javascript
echarts同一页面中四个图表切换的js数据交互方法示例
2018/07/03 Javascript
Vue移动端项目实现使用手机预览调试操作
2020/07/18 Javascript
Python图像处理PIL各模块详细介绍(推荐)
2019/07/17 Python
Python判断字符串是否xx开始或结尾的示例
2019/08/08 Python
利用Python如何实时检测自身内存占用
2020/05/09 Python
Pytorch如何切换 cpu和gpu的使用详解
2021/03/01 Python
深入浅析css3 中display box使用方法
2015/11/25 HTML / CSS
药学专业大学生个人的自我评价
2013/11/04 职场文书
区域销售经理岗位职责
2013/12/10 职场文书
求职信的最佳写作思路
2014/02/01 职场文书
大学辅导员事迹材料
2014/02/05 职场文书
幸福家庭标语
2014/06/27 职场文书
汉语专业毕业生自荐信
2014/07/06 职场文书
银行职员工作失误检讨书
2014/10/14 职场文书
升职自我推荐信范文
2015/03/25 职场文书
不同意离婚上诉状
2015/05/23 职场文书
2016年记者节感言
2015/12/08 职场文书
商业计划书格式、范文
2019/03/21 职场文书
详解MySQL中的pid与socket
2021/06/15 MySQL
Python通用验证码识别OCR库ddddocr的安装使用教程
2022/07/07 Python