从后台获取的数据渲染到页面中的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 ...
随机推荐
- 'pip' 不是内部或外部命令
安装好Python,在环境变量Path中加入相应路径信息后,Python命令没问题,但是运行pip失败: 'pip' 不是内部或外部命令,Pip工具已经自带安装好了,只是跟Python命令一样,需要我 ...
- 04-spark streaming
1.基本概念(了解) ①流(Streaming): 是一种数据传送技术,它把客户机收到的数据变成一个稳定连续的流,源源不断地送出,使用户听到的声音或看到的图象十分平稳, 而且用户在整个文件送完之前就可 ...
- isinstance, type, issubclass
isinstance: 判断你给对象是否是xx类型的. (向上判断)type: 返回xxx对象的数据类型issubclass: 判断xxx类是否xxx的子类 class Animal: def eat ...
- python - requests从excel中获取测试用例数据
HttpRequests.py #-*- coding:utf-8 -*- import requests class HttpRequests(): def http_requests(self,u ...
- .NET MVC同页面显示从不同数据库(mssql、mysql)的数据
控制器: private readonly VipViewModel _model = new VipViewModel(); public static string Msg;// GET: Sys ...
- ubantu 上hadoop 搭建
Hadoop安装教程_单机/伪分布式配置_Hadoop2.6.0/Ubuntu14.04 参考 http://www.powerxing.com/install-hadoop/ 2014-08-09 ...
- tomcat和eclipse-wtp的一些配置
TOMCAT配置UTF-8 server.xml配置文件: <Connector port="8080" protocol="HTTP/1.1" conn ...
- uva-519-拼图
给你N*M个碎片,问能否用他们拼成一个矩形,矩形的边缘要全是F,除外界边缘的边要么是I,要么O,不能是F1.碎片会重复出现,所以同样的碎片在同一个位置,如果已经不能放,直接跳过就行2.矩形的边缘要全是 ...
- python学习笔记_week8
一.Socket 当服务端传的东西大于客户端的最大值时怎么办?①改大buffer不行(有上限)②多传几次(用for循环必须要知道循环几次,所以不用for循环,用while) 服务端: import o ...
- 4. easyui删除功能实例
############实例1############## function delPerson(id) { $.messager.defaults = { ok : "确定", ...