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

下面我就为大家分享一篇jQuery实现标签子元素的添加和赋值方法，具有很好的参考价值，希望对大家有所帮助。

一、在jsp页面中定义标签，如下：

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

二、编写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);
}
}

四、实现效果如下：

上面是我整理给大家的，希望今后会对大家有帮助。

相关文章：

如何使用ngrok+express解决微信接口调试问题

如何使用element-ui表格实现单元格可编辑

在element ui里如何使dialog关闭后清除验证

以上是在jQuery中实现标签子元素的添加和赋值方法的详细内容。更多信息请关注PHP中文网其他相关文章！

相关标签：

jquery 元素 添加

来源：php.cn

上一篇：在jQuery中如何改变P标签文本值 下一篇：通过在js动态中创建标签,并设置属性方法（详细教程）

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

作者最新文章

• 在weebox中有关弹出窗口不居中问题
  2018-06-23 18:19:43
• 在vue+canvas中有关excel-like组件如何使用
  2018-06-23 18:17:39
• 在JavaScript中有关class如何调用
  2018-06-23 18:11:37
• 使用Vue框架如何实现上拉刷新功能
  2018-06-23 18:10:14
• 使用Vue移动端如何实现图片裁剪组件
  2018-06-23 18:06:43
• 有关微信小程序模板和模块化用法（详细教程）
  2018-06-23 18:04:28
• 在vue2中如何实现上拉加载功能
  2018-06-23 18:02:45
• 使用Vue2如何实现三级联动
  2018-06-23 18:00:45
• 在vue2中如何实现数据请求显示loading图
  2018-06-23 17:58:23
• 使用元素全屏如何做到设置与监听
  2018-06-23 17:56:41

最新问题

使用 Javascript / Jquery 提交表单且不带按钮 我试图通过调用JavaScript函数并使用JQUERY/PHP执行表单来提交没有按钮的表单。我希望表单在后端静默执行，而无需重新加载页面。不幸的是，它不断返回JavaScript...

来自于 2024-04-06 14:54:03

0

2

421

如何使用 jquery 检索 HTML 数据表中未选定行的值 我试图获取所有未单击按钮的行的值。例如，当我单击第一行上的按钮时，我想检索没有单击的行的值。vartable=document.getElementById("all_d...

来自于 2024-04-05 09:26:49

0

1

1418

需要一个 jquery 脚本，根据最终用户的当前选择从选择框中移动选定的选项 我有一个HTML页面，最终用户可以通过选择框元素对我们的项目进行排名。请参阅小提琴来观看简单的演示：https://jsfiddle.net/Balkanlii/ghecv1j8/...

来自于 2024-04-04 18:40:04

0

1

3528

我已经通过书签在纯 CSS 中创建了一个元素。它已创建，但不可见 我的代码如下：g=document.createElement('div');g.setAttribute("id","divcontainer&qu...

来自于 2024-04-04 17:27:27

0

1

417

在 Safari/Firefox iOS 上无法发送表单数据 这适用于除iOS上的Safari/Firefox之外的所有平台：jQuery("#gform_1").one('submit',function(event){...

来自于 2024-04-04 12:53:48

0

1

303

相关专题

更多>

• jquery插件有哪些
• Java怎么求数组元素的最大和最小值
• jquery怎么操作json
• jquery删除元素的方法
• jQuery hover()方法的使用
• jquery实现分页方法
• jquery中隐藏元素是什么
• jquery中什么是高亮显示

热门推荐

• js是什么意思
• js怎么将字符串转为数组？
• javascript如何刷新页面
• js数组怎么删除某一项
• sqrt函数怎么使用

热门教程

更多>

相关教程

热门推荐

最新课程

• 
  最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)

  1415841
• 
  php入门教程之一周学会PHP

  4255055
• 
  JAVA 初级入门视频教程

  2466192
• 
  小甲鱼零基础入门学习Python视频教程

  502895
• 
  PHP 零基础入门教程

  843264

• 
  最新ThinkPHP 5.1全球首发视频教程(60天成就PHP大牛线上培训班课)

  1415841次学习
• 
  JAVA 初级入门视频教程

  2466192次学习
• 
  小甲鱼零基础入门学习Python视频教程

  502895次学习
• 
  Web前端开发极速入门

  215197次学习
• 
  零基础精通 PS 视频教程

  874604次学习

• 
  【web前端】Node.js快速入门

  6218次学习
• 
  国外Web开发全栈课程全集

  4847次学习
• 
  Go语言实战之 GraphQL

  4078次学习
• 
  550W粉丝大佬手把手从零学JavaScript

  605次学习
• 
  python大神Mosh，零基础小白6小时完全入门

  20755次学习

最新下载

更多>

网站特效

网站源码

网站素材

前端模板

• [表单按钮] jQuery企业留言表单联系代码
• [播放器特效] HTML5 MP3音乐盒播放特效
• [菜单导航] HTML5炫酷粒子动画导航菜单特效
• [表单按钮] jQuery可视化表单拖拽编辑代码
• [播放器特效] VUE.JS仿酷狗音乐播放器代码
• [html5特效] 经典html5推箱子小游戏
• [图片特效] jQuery滚动添加或减少图片特效
• [相册特效] CSS3个人相册封面悬停放大特效

• [前端模板] 家居装潢清洁维修服务公司网站模板
• [前端模板] 清新配色个人求职简历引导页模板
• [前端模板] 设计师创意求职简历网页模板
• [前端模板] 现代工程建筑公司网站模板
• [前端模板] 教育服务机构响应式HTML5模板
• [前端模板] 网上电子书店商城网站模板
• [前端模板] IT技术解决互联网公司网站模板
• [前端模板] 紫色风格外汇交易服务网站模板

• [PNG素材] 可爱的夏天元素矢量素材(EPS+PNG)
• [PNG素材] 四个红的的 2023 毕业徽章矢量素材(AI+EPS+PNG)
• [banner图] 唱歌的小鸟和装满花朵的推车设计春天banner矢量素材(AI+EPS)
• [PNG素材] 金色的毕业帽矢量素材(EPS+PNG)
• [PNG素材] 黑白风格的山脉图标矢量素材(EPS+PNG)
• [PNG素材] 不同颜色披风和不同姿势的超级英雄剪影矢量素材(EPS+PNG)
• [banner图] 扁平风格的植树节banner矢量素材(AI+EPS)
• [PNG素材] 九个漫画风格的爆炸聊天气泡矢量素材(EPS+PNG)

• [前端模板] 家居装潢清洁维修服务公司网站模板
• [前端模板] 清新配色个人求职简历引导页模板
• [前端模板] 设计师创意求职简历网页模板
• [前端模板] 现代工程建筑公司网站模板
• [前端模板] 教育服务机构响应式HTML5模板
• [前端模板] 网上电子书店商城网站模板
• [前端模板] IT技术解决互联网公司网站模板
• [前端模板] 紫色风格外汇交易服务网站模板

关于我们 免责声明 Sitemap

PHP中文网：公益在线PHP培训，帮助PHP学习者快速成长！