jQuery实现点击下拉框中的值累加到文本框中的方法示例


Posted in jQuery onOctober 28, 2017

本文实例讲述了jQuery实现点击下拉框中的值累加到文本框中的方法。分享给大家供大家参考,具体如下:

先来看看运行效果:

 jQuery实现点击下拉框中的值累加到文本框中的方法示例

具体代码如下:

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
 <title>3water.com jQuery添加下拉框元素</title>
 <script src="https://cdn.bootcss.com/jquery/1.10.2/jquery.min.js"></script>
</head>
<!-- 加在body标签中屏蔽右键 oncontextmenu="return false" -->
<body >
<select name="city" id="s2" lay-search>
 <option value="">请选择</option>
 <option value="layer">layer</option>
 <option value="form">form</option>
 <option value="layim">layim</option>
</select>
<button class="layui-btn " type="button" id="add_subject">添加</button>
<input name="subject" id="subject" type="text" data-label="," value="">
<script>
  var seleVal='';
  $("#add_subject").on("click",function(){
    seleVal+=$("#s2>option:selected").val()+',';
    $("#subject").val(seleVal);
  })
</script>
</body>
</html>

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

jQuery 相关文章推荐
jQuery实现简单漂亮的Nav导航菜单效果
Mar 29 jQuery
jQuery实现键盘回车搜索功能
Jul 25 jQuery
jquery获取链接地址和跳转详解(推荐)
Aug 15 jQuery
javascript+jQuery实现360开机时间显示效果
Nov 03 jQuery
jquery实现回车键触发事件(实例讲解)
Nov 21 jQuery
jQuery实现的两种简单弹窗效果示例
Apr 18 jQuery
jQuery中的$是什么意思及 $. 和 $().的区别
Apr 20 jQuery
jQuery实现网页拼图游戏
Apr 22 jQuery
jquery无缝图片轮播组件封装
Nov 25 jQuery
jQuery实现的五星点评功能【案例】
Feb 18 jQuery
jQuery操作动画完整实例分析
Jan 10 jQuery
jQuery实时统计输入框字数及限制
Jun 24 jQuery
jquery ajax异步提交表单数据的方法
Oct 27 #jQuery
360提示[高危]使用存在漏洞的JQuery版本的解决方法
Oct 27 #jQuery
关于jQuery里prev()的简单操作代码
Oct 27 #jQuery
jQuery判断网页是否已经滚动到浏览器底部的实现方法
Oct 27 #jQuery
JavaScript自执行函数和jQuery扩展方法详解
Oct 27 #jQuery
jquery使用iscorll实现上拉、下拉加载刷新
Oct 26 #jQuery
使用JQuery实现图片轮播效果的实例(推荐)
Oct 24 #jQuery
You might like
PHP与Java进行通信的实现方法
2013/10/21 PHP
php找出指定范围内回文数且平方根也是回文数的方法
2015/03/23 PHP
Java中final关键字详解
2015/08/10 PHP
PHP list() 将数组中的值赋给变量的简单实例
2016/06/13 PHP
thinkphp5实现无限级分类
2019/02/18 PHP
php+mysql开发的最简单在线题库(在线做题系统)完整案例
2019/03/30 PHP
laravel框架实现后台登录、退出功能示例
2019/10/31 PHP
js获取提交的字符串的字节数
2009/02/09 Javascript
jQuery EasyUI API 中文文档 - ComboGrid 组合表格
2011/10/13 Javascript
JavaScript中实现异步编程模式的4种方法
2014/09/24 Javascript
node.js中的fs.fstatSync方法使用说明
2014/12/15 Javascript
谈谈JSON对象和字符串之间的相互转换JSON.stringify(obj)和JSON.parse(string)
2015/10/01 Javascript
jQuery实现模仿微博下拉滚动条加载数据效果
2015/12/25 Javascript
jQuery实现图片向左向右切换效果的简单实例
2016/05/18 Javascript
js给table赋值的实例代码
2016/10/13 Javascript
vue-hook-form使用详解
2017/04/07 Javascript
Three.js加载外部模型的教程详解
2017/11/10 Javascript
Vue+webpack项目配置便于维护的目录结构教程详解
2018/10/14 Javascript
微信小程序实现获取小程序码和二维码java接口开发
2019/03/29 Javascript
记录一次开发微信网页分享的步骤
2019/05/07 Javascript
js实现继承的方法及优缺点总结
2019/05/08 Javascript
JS async 函数的含义和用法实例总结
2020/04/08 Javascript
JavaScript快速调试的两个技巧
2020/11/04 Javascript
如何准确判断请求是搜索引擎爬虫(蜘蛛)发出的请求
2015/10/13 Python
Python守护线程用法实例
2017/06/23 Python
Python通过matplotlib画双层饼图及环形图简单示例
2017/12/15 Python
python dataframe 输出结果整行显示的方法
2018/06/14 Python
python3.6利用pyinstall打包py为exe的操作实例
2018/10/31 Python
HTML5 新事件 小结
2009/07/16 HTML / CSS
美国医疗用品、医疗设备和家庭保健用品商店:Medical Supply Depot
2018/07/08 全球购物
武汉东之林科技有限公司机试
2013/09/17 面试题
大学校园生活自我鉴定
2014/01/13 职场文书
优秀学生干部事迹材料
2014/12/24 职场文书
鲁迅故里导游词
2015/02/05 职场文书
清洁工个人工作总结
2015/03/05 职场文书
Vue接口封装的完整步骤记录
2021/05/14 Vue.js