下午分享《MVC编辑状态两个DropDownList联动http://www.cnblogs.com/insus/p/3426563.html 不久,马上有网友问及三级联动的例子。Insus.NET回复他,会做二级联动,三级应该不难。原理与方法是一样的。

写此篇的目的,还是处理jQuery怎样获取动态产生后的html的标签或是元素。
还是先回过头去看篇头指定的链接的文章。一开始时,Insus.NET使用了jQuery的ajax产生了一数据行,并append至

 <tbody id="tbody1"></tbody>

但是,在后续的jQuery是很难找到append的html的标签或元素。为了能找到两个select下拉列表,Insus.NET当时只能把相关的代码都写在

 function OutputData(tbody, item) {}

这个自定义函数内。
这一直不是Insus.NET想要的。不太喜欢把什么代码均写在一个函数内,这样日后的维护带来相当大的困惑。当时完成它时,只求功能的实现。现在,Insus.NET决定再重构这部分。尽量把它能抽取的或是拆分的,都抽取和拆分成更细小,单独的函数。

第一个可以抽取的是联动有事件:

把它拿掉,并移出这个自定义函数外:

那change函数需要改为#93行的语法,另外事件中需要获取两个select的下拉列表,也需要分别改为#96和#98行,一个获取控件之后,还要获取其值,另一个仅是获取控件。

第二个可移动的地方,是那个更新的数据的部分代码:

可以写在一个单独立的

 $(document).ready(function () {}

代码有变动的地方,可参考下图高亮部分:

经这样重构之后,能脱离这个函数的代码,均移至

 function OutputData(tbody, item) {}

这个自定义函数外。

重构之后,此视图完整代码:

jQuery获取动态产生的html内标签或元素的更多相关文章

  1. jQuery获取动态添加的元素,live和on的区别

    今天给大家说一下如果用jQuery获取动态添加的元素,通常如果你在网页上利用jQuery添加一个元素,那么用平常的jQuery获取元素的方法无效的获取不到的.可以用以下的方法获取动态元素!假设我们现在 ...

  2. jQuery获取Select选择的Text(非表单元素)和 Value(表单元素)(转)

    jQuery获取Select选择的Text和Value: 语法解释: . $("#select_id").change(function(){//code...}); //为Sel ...

  3. jQuery获取table表中的td标签

    首先我来介绍一下我遇到的问题 1.当有一个table表包含了<tr>标签,<td>标签,大致可以认为是这样的: <tr> <td> @scene.ID ...

  4. jQuery获取动态生成的元素

    需求描述:页面上可以动态添加数据,比如table,点击按钮可以动态添加行.又或页面 加载时table数据是通过ajax从后台获取的.而这时我们想要获取其中的某个值,又该如何获取呢? 如果是要通过某个事 ...

  5. 记录--jquery 获取父级、子级、兄弟元素 + 实例

    需求如下: 三条数据,需点击其中一条数据在其下面展示与此数据关联的图片.主要功能可能是在点击的数据下增加显示行 思路: 把需要点击增加的数据先隐藏.点击后再将其显示出来. 知识点: jQuery.pa ...

  6. Jquery插件实现点击获取验证码后60秒内禁止重新获取

    通过jquery.cookie.js插件可以快速实现“点击获取验证码后60秒内禁止重新获取(防刷新)”的功能 先到官网(http://plugins.jquery.com/cookie/ )下载coo ...

  7. 关于jquery html()方法获取带有OBJECT标签的元素内容时,出现“类型不匹配。”的解决办法

    关于jquery html()方法获取带有OBJECT标签的元素内容时,出现“类型不匹配.”的解决办法 解决办法: $("selector").clone().html()

  8. jquery获取节点的时候获取包含自己在内的HTML标签

    jquery获取某个标签的html()方法的时候总是只能获取内部的 如果获取包含自身的HTML代码呢? 用.prop("outerHTML")方法获取 <div id=&qu ...

  9. Jquery 实现动态加入table tr 和删除tr 以及checkbox的全选 和 获取加入TR删除TR后的数据

    关于jquery实现动态加入table tr的问题我也不多说了 上面代码非常多地方都有凝视的 关于返回的 编辑后的table 数据 我这里想说的是我直接把他保存成一个连接起来的字符串了 格式 str= ...

随机推荐

  1. 转 iOS宏定义的使用与规范

    宏定义在很多方面都会使用,例如定义高度.判断iOS系统.工具类,还有诸如文件路径.服务端api接口文档.为了对宏能够快速定位和了解其功能,我们最好在定义的时候将其放入特定的头文件中,下面我抛砖引玉,对 ...

  2. vue项目webpack中Npm传递参数配置不同域名接口

    项目开发中,前端在配置后端api域名时很困扰,常常出现:本地开发环境: api-dev.demo.com测试环境: api-test.demo.com线上生产环境: api.demo.com, 这次是 ...

  3. 实验6 LCD接口

    1.利用单片机控制LCD1602,在LCD1602上显示字符串,并使其整屏左移. #include<reg51.h> #define uchar unsigned char #define ...

  4. ASP.NET MVC 使用Unity实现Ioc

    为什么有这篇文章 最近在学ASP.NET MVC项目中使用Ioc,选用了Unity作为依赖注入的容器组件,在网上找了相关的文章简单实现了依赖注入,但想用文件配置的方式进行容器注入的注册,发现相关的文章 ...

  5. Linux查看运行时间

    以下命令都可以查看出系统运行时间.对于查看机器的状态很有帮助. w -b 查看最后一次系统启动的时间 w -r 查看当前系统运行时间 last reboot 查看系统历史启动的时间 top up后表示 ...

  6. 下拉框select中option居中样式

    下拉框select中option居中样式 text-align:center;text-align-last:center;

  7. ReactNatvie遇到的错误

    1:新版的React包中没有包含PropTypes,如果使用需要从‘prop-types’包中导入. 2: 'prop-types'包中直接定义‘PropTypes.style’是无效的,需要使用‘P ...

  8. form表单组件

    1.sweetalert 组件地址 form组件 form表单完成的事情,:   提供input可以提交数据, 对提交的数据进行校验,提供错误提示 定义form组件 from django impor ...

  9. 利用koa实现mongodb数据库的增删改查

    概述 使用koa免不了要操纵数据库,现阶段流行的数据库是mongoDB,所以我研究了一下koa里面mongoDB数据库的增删改查,记录下来,供以后开发时参考,相信对其他人也有用. 源代码请看:我的gi ...

  10. maven项目无法新增java test目录的问题

    有时候当我们构建好maven项目时,再导入eclipse中会缺少src/main/java  和src/test/java,这是需要我们手动创建: 但是有时候在 项目视图下或者 enterprise ...