下午分享《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. Android-Throwable: A WebView method was called on thread 'JavaBridge'.

    错误详情: 01-30 03:36:52.441 12000-12048/cn.h5 D/@@@: e.ttt:java.lang.RuntimeException: java.lang.Throwa ...

  2. Android-Java-synchronized静态方法&字节码文件对象

    上一篇博客 Android-Java-同步方法-synchronized,中讲解了普通方法加入synchronized修饰符,此synchronized的同步锁是this,还介绍方法的封装性,这篇博客 ...

  3. Hiho #1075: 开锁魔法III

    Problem Statement 描述 一日,崔克茜来到小马镇表演魔法. 其中有一个节目是开锁咒:舞台上有 n 个盒子,每个盒子中有一把钥匙,对于每个盒子而言有且仅有一把钥匙能打开它.初始时,崔克茜 ...

  4. Android开发重点难点:RelativeLayout(相对布局)详解

    https://i.cnblogs.com/EditPosts.aspx?opt=1 重点知识 和线性布局(LinearLayout)一样,RelaiveLayout相对布局也是我们用的比较多的一个布 ...

  5. Windows安装python3.x后,pip list警告!DEPRECATION: The default format will switch to columns in the future.

    前言(凑字数专用) 这个警告虽然不影响你的正常使用,但是每次都好几行红色警告,总是给人一种怪怪的感觉(当然不是FBI的警告了……),所以咱们还是把他解决掉~ 网上好多解决办法都是Ubuntu的解决办法 ...

  6. 【LeetCode】547. 朋友圈

    题目 班上有 N 名学生.其中有些人是朋友,有些则不是.他们的友谊具有是传递性.如果已知 A 是 B 的朋友,B 是 C 的朋友,那么我们可以认为 A 也是 C 的朋友.所谓的朋友圈,是指所有朋友的集 ...

  7. ssh-key的复制

    执行ssh-keygen 生产钥 在b主机root目录创建.ssh文件夹 在a主机输入ssh-copy-id root@*.*.*.* 就把公钥复制过去了 命令:scp 不同的Linux之间copy文 ...

  8. 使用代码查看Nutch爬取的网站后生成的SequenceFile信息

    必须针对data文件中的value类型来使用对应的类来查看(把这个data文件,放到了本地Windows的D盘根目录下). 代码: package cn.summerchill.nutch; impo ...

  9. 图片训练:使用卷积神经网络(CNN)识别手写数字

    这篇文章中,我们将使用CNN构建一个Tensorflow.js模型来分辨手写的数字.首先,我们通过使之“查看”数以千计的数字图片以及他们对应的标识来训练分辨器.然后我们再通过此模型从未“见到”过的测试 ...

  10. COM+时代的自动事务

    最近看公司的遗留项目代码,调试的时候发现经常报分布式事务错误,可是整个代码里没有看见开启过事务,于是开始研究,发现了这个.Net Framework1.1时代的产物. namespace Busine ...