从后台获取的数据渲染到页面中的dom操作
很多情况下页面dom都是从后台拼接字符串添加生成的新的dom元素,在编辑器中不能看到,只能通过检查看到页面的dom结构,但是这时候会发生一个问题,就是如果使用jQuery无法进行dom操作,事件和方法都没有反应,我以前是使用
$ (document).on('DOMNodeInserted',function () {
{
要操作的后台获取的数据的字符串拼接的新的dom元素
}
})
使用这个方法有一个弊端,就是如果该dom元素是数组形式拼接的dom,如果li元素,如果这些li元素都有点击事件这样如果使用这个方法,没个li都会发生相应的点击事件
2018年08.12就出现了这个问题,那个是tr表格元素,需要点击每个tr但是我使用数组循环做出的,然后点击时候,发行所有的tr都触发了点击事件,后来使用
$('body').on("click","table.first tbody tr", function () {
要操作的代码
});
这样才有事件代理将所有的tr由上层元素body来代理,这样上面出现的问题也就解决了,非常完美,以后也尽量使用这个方法来触发新渲染出来的dom元素的点击和方法。
从后台获取的数据渲染到页面中的dom操作的更多相关文章
- .net dataGridView当鼠标经过时当前行背景色变色;然后【给GridView增加单击行事件,并获取单击行的数据填充到页面中的控件中】
1.首先在前台dataGridview属性中增加onRowDataBound属性事件 2.然后在后台Observing_RowDataBound事件中增加代码 protected void Obser ...
- Flask04 后台获取请求数据、视图函数返回类型、前台接受响应数据
1 后台获取请求数据 1.1 提出问题 前台发送请求的方式有哪些 后台如何获取这些请求的参数 1.2 前台发送请求的方式 GET.POST.AJAX 点睛:如果不指定请求方式,浏览器默认使用GET请求 ...
- jquery用ajax方式从后台获取json数据后如何将内容填充到下拉列表
对于问题从后台获取json数据,将内容填充到下拉列表,代码非常简单,具体过程请看下面代码. 需求:url:链接 par:ID sel:下拉列表选择器 function BuildS ...
- jquery用ajax方式从后台获取json数据,将内容填充到下拉列表。
从后台获取json数据,将内容填充到下拉列表. url:链接 par:ID sel:下拉列表选择器 //获取下拉列表 function BuildSelectBox(url, par, sel) { ...
- .net后台获取DataTable数据,转换成json数组后传递到前台,通过jquery去操作json数据
一,后台获取json数据 protected void Page_Load(object sender, EventArgs e){ DataTable dt = DBhepler.GetDataT ...
- jQuery 中使用 DOM 操作节点,对页面中的表格实现增、删、查、改操作
查看本章节 查看作业目录 需求说明: 在 jQuery 中使用 DOM 操作节点,对页面中的表格实现增.删.查.改操作 点击"增加"超链接时,将表格中的第一条数据添加到表格的末尾 ...
- 微信小程序请求wx.request数据,渲染到页面
先说一下基本使用.官网也有. 比如说你在App.js里面有这些变量.想修改某些值. data: { main_view_bgcolor: "", border: "&qu ...
- 使用logstash拉取MySQL数据存储到es中的再次操作
使用情况说明: 已经使用logstash拉取MySQL数据存储到es中,es中也创建了相应的索引,也存储了数据.假若把这个索引给删除了,再次进行同步操作的话要咋做,从最开始的数据进行同步,而不是新增的 ...
- Vue获取后端数据 渲染页面后跳转
主页面 <template> <div> <ul v-for="item in courseList"> <router-link :to ...
随机推荐
- canvas实现刮刮乐
效果展示 源码下载
- 《算法》第四章部分程序 part 1
▶ 书中第四章部分程序,加上自己补充的代码,包含无向 / 有向图类 ● 无向图类 package package01; import java.util.NoSuchElementException; ...
- Yii框架中使用SRBAC作为权限管理模块时遇到的问题
Yii框架中使用SRBAC作为权限管理模块时遇到的问题 看到Yii中提供RBAC的插件,SRBAC,就想用用. 结果按照手册上的安装办法,整来整去,安装完了,可就是进不了权限管理界面. 最后想到, ...
- C#内存管理和垃圾回收机制
数据类型 垃圾回收机制 一.数据类型 C#中的数据类型分为值类型 (Value type) 和引用类型(reference type), 值 类 型: 所有的值类型都集成自 System.Value ...
- SaltStack 和 Ansible 的简单比较
https://blog.csdn.net/nqxqxq/article/details/76154847 https://www.cnblogs.com/lgeng/p/6567424.html ...
- debug_toolbar工作原理
#toolbar的中间件的响应处理函数,会调用到panel.generate_stats(request, response)def process_response(self, request, r ...
- java位运算(操作)的使用
位操作是程序设计中对位模式按位或二进制数的一元和二元操作. 在许多古老的微处理器上, 位运算比加减运算略快, 通常位运算比乘除法运算要快很多. 在现代架构中, 情况并非如此:位运算的运算速度通常与加法 ...
- nginx 代理跨域
跨域 nginx设置http{ add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Headers X- ...
- Deque 双端队列 Stack 堆栈
1. peek 获取栈顶元素 pop 删除栈顶元素
- 如何创建一个django工程与和mysql打通
1. 安装Django # 在指定解释器环境下安装django 1.11.x # 在真实python3环境下: pip3 install django==1.11.x # 查看django版本: dj ...