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日历价格、库存等设置插件
Jul 05 jQuery
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 jQuery
jQuery实现获取table中鼠标click点击位置行号与列号的方法
Oct 09 jQuery
jQuery幻灯片插件owlcarousel参数说明中文文档
Feb 27 jQuery
jQuery实现表格隔行换色
Sep 01 jQuery
详解jQuery获取特殊属性的值以及设置内容
Nov 14 jQuery
jQuery选择器选中最后一个元素,倒数第二个元素操作示例
Dec 10 jQuery
Jquery的Ajax技术使用方法
Jan 21 jQuery
jQuery Ajax async=&gt;false异步改为同步时,解决导致浏览器假死的问题
Jul 22 jQuery
jQuery实现图片随机切换、抽奖功能(实例代码)
Oct 23 jQuery
jQuery实现鼠标放置名字上显示详细内容气泡提示框效果的方法分析
Apr 04 jQuery
jQuery加PHP实现图片上传并提交的示例代码
Jul 16 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
ThinkPHP实现二级循环读取的方法
2014/11/03 PHP
PHP中使用file_get_contents post数据代码例子
2015/02/13 PHP
php图像处理函数imagecopyresampled用法详解
2016/12/02 PHP
php use和include区别总结
2019/10/13 PHP
laravel框架select2多选插件初始化默认选中项操作示例
2020/02/18 PHP
js实现单一html页面两套css切换代码
2013/04/11 Javascript
javascript中的绑定与解绑函数应用示例
2013/06/24 Javascript
禁用页面部分JavaScript不是全部而是部分
2014/09/03 Javascript
jQuery-1.9.1源码分析系列(十)事件系统之事件包装
2015/11/20 Javascript
学习Angular中作用域需要注意的坑
2016/08/17 Javascript
ES6新特性之函数的扩展实例详解
2017/04/01 Javascript
weui框架实现上传、预览和删除图片功能代码
2017/08/24 Javascript
JavaScript门道之标准库
2018/05/26 Javascript
Vue加载组件、动态加载组件的几种方式
2018/08/31 Javascript
JS实现选项卡效果的代码实例
2019/05/20 Javascript
js事件触发操作实例分析
2019/06/21 Javascript
微信小程序云开发如何实现数据库自动备份实现
2019/08/16 Javascript
构建大型 Vue.js 项目的10条建议(小结)
2019/11/14 Javascript
用Python实现服务器中只重载被修改的进程的方法
2015/04/30 Python
详解Python3操作Mongodb简明易懂教程
2017/05/25 Python
python链接oracle数据库以及数据库的增删改查实例
2018/01/30 Python
pywinauto自动化操作记事本
2019/08/26 Python
python实现视频压缩功能
2020/12/18 Python
Pureology官网:为染色头发打造最好的产品
2019/09/13 全球购物
4s客服专员岗位职责
2013/12/01 职场文书
后备干部培训方案
2014/05/22 职场文书
学习焦裕禄同志为人民服务思想汇报
2014/09/10 职场文书
个人租房协议书
2014/11/28 职场文书
2014年语文教师工作总结
2014/12/18 职场文书
事业单位财务人员岗位职责
2015/04/14 职场文书
运动会闭幕式致辞
2015/07/29 职场文书
2016年五四青年节校园广播稿
2015/12/17 职场文书
创业计划书之面包店
2019/09/17 职场文书
MySQL 数据恢复的多种方法汇总
2021/06/21 MySQL
Go语言并发编程 sync.Once
2021/10/16 Golang
JavaCV实现照片马赛克效果
2022/01/22 Java/Android