jQuery实现标签子元素的添加和赋值方法


Posted in jQuery onFebruary 24, 2018

一、在jsp页面中定义<select>标签,如下:

<div>
<span>科室:</span>
<select class="dept-name-show" style="width: 70%;">
</select>
</div>

二、编写js语句:

<script>
$(function () {
var dname = $(".dept-name-show").eq(0);//选定<select>标签
var url = "${pageContext.request.contextPath}/getDepts.do";//请求路径
$(".dept-name-show").click(function () {
$.get(
url,
function (res) {
var len = res.length;
var op = dname.children().length;
if (op < len) {
var pp = "<option></option>";
for (var i = 0; i < len; i++) {
dname.append(pp);
dname.children().eq(i).text(res[i].name);
}
}
}
)
})
})
</script>

三、编写对应的请求语句:

List<Dept> deptList=null;
@RequestMapping(value = "/getDepts",method = {RequestMethod.GET})
public void getDepts(HttpServletResponse response) throws IOException {
response.setCharacterEncoding("utf-8");
response.setContentType("text/json;charset=utf-8");
if (deptList == null){
deptList = deptService.findAllDepts();
}else {
String res=JSON.toJSONString(deptList);
response.getWriter().write(res);
}
}

四、实现效果如下:

jQuery实现标签子元素的添加和赋值方法

jQuery实现标签子元素的添加和赋值方法

以上这篇jQuery实现标签子元素的添加和赋值方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

jQuery 相关文章推荐
jQuery使用unlock.js插件实现滑动解锁
Apr 04 jQuery
jQuery remove()过滤被删除的元素(推荐)
Jul 18 jQuery
jQuery实现手势解锁密码特效
Aug 14 jQuery
jQuery实现菜单栏导航效果
Aug 15 jQuery
jquery+ajaxform+springboot控件实现数据更新功能
Jan 22 jQuery
实现jquery放大镜的两种方法
Feb 22 jQuery
jQuery+koa2实现简单的Ajax请求的示例
Mar 06 jQuery
jQuery动态移除与增加onclick属性的方法详解
Jun 07 jQuery
基于jQuery使用Ajax动态执行模糊查询功能
Jul 05 jQuery
jQuery中使用validate插件校验表单功能
May 24 jQuery
深入分析jQuery.one() 函数
Jun 03 jQuery
js和jquery判断数据类型的4种方法总结
Aug 28 jQuery
jquery 给动态生成的标签绑定事件的几种方法总结
Feb 24 #jQuery
jquery动态添加带有样式的HTML标签元素方法
Feb 24 #jQuery
jQuery动态添加li标签并添加属性和绑定事件方法
Feb 24 #jQuery
vue.js2.0点击获取自己的属性和jquery方法
Feb 23 #jQuery
实现jquery放大镜的两种方法
Feb 22 #jQuery
jQuery实现滚动到底部时自动加载更多的方法示例
Feb 18 #jQuery
jQuery实现鼠标响应式透明度渐变动画效果示例
Feb 13 #jQuery
You might like
计算一段日期内的周末天数的php代码(星期六,星期日总和)
2009/11/12 PHP
深入apache host的配置详解
2013/06/09 PHP
浅谈PHP eval()函数定义和用法
2016/06/21 PHP
php版微信公众平台接口开发之智能回复开发教程
2016/09/22 PHP
PHP CURL与java http使用方法详解
2018/01/26 PHP
javascript中函数作为参数调用的方法
2015/02/09 Javascript
简介JavaScript中setUTCSeconds()方法的使用
2015/06/12 Javascript
vue轮播图插件vue-awesome-swiper的使用代码实例
2017/07/10 Javascript
Angular2+国际化方案(ngx-translate)的示例代码
2017/08/23 Javascript
Node.js 使用递归实现遍历文件夹中所有文件
2017/09/18 Javascript
利用js编写网页进度条效果
2017/10/08 Javascript
超出JavaScript安全整数限制的数字计算BigInt详解
2018/06/24 Javascript
Vue 路由 过渡动效 数据获取方法
2018/07/31 Javascript
微信小程序收货地址API兼容低版本解决方法
2019/05/18 Javascript
ES6的循环与可迭代对象示例详解
2021/01/31 Javascript
python实现爬虫下载漫画示例
2014/02/16 Python
在Django中进行用户注册和邮箱验证的方法
2016/05/09 Python
Python中shape计算矩阵的方法示例
2017/04/21 Python
python分析作业提交情况
2017/11/22 Python
Python tkinter事件高级用法实例
2018/01/31 Python
为什么入门大数据选择Python而不是Java?
2018/03/07 Python
Flask框架信号用法实例分析
2018/07/24 Python
通过python将大量文件按修改时间分类的方法
2018/10/17 Python
python实现石头剪刀布小游戏
2021/01/20 Python
python中eval与int的区别浅析
2019/08/11 Python
python的mysql数据库建立表与插入数据操作示例
2019/09/30 Python
TensorFlow实现模型断点训练,checkpoint模型载入方式
2020/05/26 Python
css3 给背景设置渐变色的方法
2019/09/12 HTML / CSS
英国最全面的橄榄球联盟门票网站:Live Rugby Tickets
2018/10/06 全球购物
美体小铺奥地利官方网站:The Body Shop奥地利
2019/04/11 全球购物
管理学专业个人求职信范文
2013/12/13 职场文书
入党综合考察材料
2014/06/02 职场文书
学雷锋献爱心倡议书
2015/04/27 职场文书
2016新年晚会开场白
2015/12/03 职场文书
《这片土地是神圣的》教学反思
2016/02/16 职场文书
JS异步堆栈追踪之为什么await胜过Promise
2021/04/28 Javascript