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获取table表中的td标签(实例讲解)
Jul 28 jQuery
jquery实现限制textarea输入字数的方法
Sep 06 jQuery
jquery中有哪些api jQuery主要API
Nov 20 jQuery
jQuery实现的淡入淡出与滑入滑出效果示例
Apr 18 jQuery
jquery实现的简单轮播图功能【适合新手】
Aug 17 jQuery
jQuery实现表格隔行换色
Sep 01 jQuery
jquery获取元素到屏幕四周可视距离的方法
Sep 05 jQuery
jQuery实现每日秒杀商品倒计时功能
Sep 06 jQuery
JS 遍历 json 和 JQuery 遍历json操作完整示例
Nov 11 jQuery
jQuery表单校验插件validator使用方法详解
Feb 18 jQuery
jquery实现烟花效果(面向对象)
Mar 10 jQuery
jquery简易手风琴插件的封装
Oct 13 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中array_merge和array相加的区别分析
2013/06/17 PHP
用Zend Studio+PHPnow+Zend Debugger搭建PHP服务器调试环境步骤
2014/01/19 PHP
php求两个目录的相对路径示例(php获取相对路径)
2014/03/27 PHP
php base64 编码与解码实例代码
2017/03/21 PHP
thinkPHP框架实现多表查询的方法
2018/06/14 PHP
利用js制作html table分页示例(js实现分页)
2014/04/25 Javascript
JavaScript strike方法入门实例(给字符串加上删除线)
2014/10/17 Javascript
zepto.js中tap事件阻止冒泡的实现方法
2015/02/12 Javascript
javascript中基本类型和引用类型的区别分析
2015/05/12 Javascript
纯JS实现本地图片预览的方法
2015/07/31 Javascript
情人节单身的我是如何在敲完代码之后收到12束玫瑰的(javascript)
2015/08/21 Javascript
深入解析JavaScript中的数字对象与字符串对象
2015/10/21 Javascript
Eclipse引入jquery报错如何解决
2015/12/01 Javascript
JS 清除字符串数组中,重复元素的实现方法
2016/05/24 Javascript
Bootstrap 附加导航(Affix)插件实例详解
2016/06/01 Javascript
Form表单按回车自动提交表单的实现方法
2016/11/18 Javascript
EditPlus中的正则表达式 实战(4)
2016/12/15 Javascript
js清除浏览器缓存的几种方法
2017/03/15 Javascript
jQuery实现点击下拉框中的值累加到文本框中的方法示例
2017/10/28 jQuery
CSS3结合jQuery实现动画效果及回调函数的实例
2017/12/27 jQuery
Bootstrap Table 双击、单击行获取该行及全表内容
2018/08/31 Javascript
js数组中去除重复值的几种方法
2020/08/03 Javascript
[02:43]DOTA2英雄基础教程 圣堂刺客
2013/12/09 DOTA
Python基于identicon库创建类似Github上用的头像功能
2017/09/25 Python
Python双向循环链表实现方法分析
2018/07/30 Python
python3实现名片管理系统
2020/11/29 Python
Python切片操作去除字符串首尾的空格
2019/04/22 Python
Python 给定的经纬度标注在地图上的实现方法
2019/07/05 Python
基于python调用psutil模块过程解析
2019/12/20 Python
Python3实现mysql连接和数据框的形成(实例代码)
2020/01/17 Python
HTML5 File API改善网页上传功能
2009/08/19 HTML / CSS
音乐系毕业生自荐信
2013/10/27 职场文书
竞选体育委员演讲稿
2014/04/26 职场文书
习近平在党的群众路线教育实践活动总结大会上的讲话
2014/10/21 职场文书
个人工作保证书
2015/02/28 职场文书
Golang生成Excel文档的方法步骤
2021/06/09 Golang