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 数组排序函数
Aug 20 Javascript
Document:getElementsByName()使用方法及示例
Oct 28 Javascript
通过Jquery的Ajax方法读取将table转换为Json
May 31 Javascript
谈谈VUE种methods watch和compute的区别和联系
Aug 01 Javascript
详解关于Vue2.0路由开启keep-alive时需要注意的地方
Sep 18 Javascript
详解webpack loader和plugin编写
Oct 12 Javascript
vue+iview动态渲染表格详解
Mar 19 Javascript
微信小程序自定义toast组件的方法详解【含动画】
May 11 Javascript
详解Vue项目引入CreateJS的方法(亲测可用)
May 30 Javascript
深入解读Node.js中的koa源码
Jun 17 Javascript
Node.js Domain 模块实例详解
Mar 18 Javascript
nuxt.js写项目时增加错误提示页面操作
Nov 05 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.ini 配置文件的深入解析
2013/06/17 PHP
解析在apache里面给php写虚拟目录的详细方法
2013/06/24 PHP
ThinkPHP Mobile使用方法简明教程
2014/06/18 PHP
浅谈PHP解析URL函数parse_url和parse_str
2014/11/11 PHP
PHP框架laravel的.env文件配置教程
2017/06/07 PHP
THREE.JS入门教程(4)创建粒子系统
2013/01/24 Javascript
JQuery之focus函数使用介绍
2013/08/20 Javascript
jQuery不兼容input的change事件问题解决过程
2014/12/05 Javascript
Node.js实现的简易网页抓取功能示例
2014/12/05 Javascript
Node.js事件驱动
2015/06/18 Javascript
浅谈javascript中的call、apply、bind
2016/03/06 Javascript
使用Ajax生成的Excel文件并下载的实例
2016/11/21 Javascript
JavaScript中transform实现数字翻页效果
2017/03/08 Javascript
JavaScript之面向对象_动力节点Java学院整理
2017/06/29 Javascript
详解Vue.js中.native修饰符
2018/04/24 Javascript
JavaScrip数组去重操作实例小结
2019/06/20 Javascript
小程序和web画三角形实现解析
2019/09/02 Javascript
javascript实现简单搜索功能
2020/03/26 Javascript
javascript操作向表格中动态加载数据
2020/08/27 Javascript
JavaScript实现串行请求的示例代码
2020/09/14 Javascript
JavaScript 实现继承的几种方式
2021/02/19 Javascript
[01:10]3.19DOTA2发布会 三代刀塔人第一代
2014/03/25 DOTA
[00:52]黑暗之门更新 新英雄孽主驾临DOTA2
2016/08/24 DOTA
Python+OpenCV实现图像融合的原理及代码
2018/12/03 Python
Numpy 中的矩阵求逆实例
2019/08/26 Python
TensorFlow的环境配置与安装方法
2021/02/20 Python
Html5实现二维码扫描并解析
2016/01/20 HTML / CSS
玖熙女鞋美国官网:Nine West
2016/10/06 全球购物
秋季运动会加油稿200字
2014/01/11 职场文书
环保倡议书400字
2014/05/15 职场文书
大二学生自我检讨书
2014/10/23 职场文书
五好家庭申报材料
2014/12/20 职场文书
长江七号观后感
2015/06/11 职场文书
如何制定一份可行的计划!
2019/06/21 职场文书
【DOTA2】高能暴走TK秀!PSG LGD vs ASTER - DPC 2022 WINTER TOUR CN
2022/04/02 DOTA
手把手带你彻底卸载MySQL数据库
2022/06/14 MySQL