Flask ajax 动态html 的javascript 事件失效
$('.db_edit').click(function(){
$(".editdbproduct").val($(this).parent().parent().find('.editdb_product').text());
$('.editdbserver').val($(this).parent().parent().find('.editdb_host').text());
$('.editdbname').val($(this).parent().parent().find('.editdb_instance').text());
$('.editschema').val($(this).parent().parent().find('.editdb_schemas').text());
$('.editdbdesc').val($(this).parent().parent().find('.editdb_desc').text());
orginaldb = $('.editdbname').val();
});
修改后:
$("body").delegate(".db_edit","click", function(){
$(".editdbproduct").val($(this).parent().parent().find('.editdb_product').text());
$('.editdbserver').val($(this).parent().parent().find('.editdb_host').text());
$('.editdbname').val($(this).parent().parent().find('.editdb_instance').text());
$('.editschema').val($(this).parent().parent().find('.editdb_schemas').text());
$('.editdbdesc').val($(this).parent().parent().find('.editdb_desc').text());
orginaldb = $('.editdbname').val();
});
原因: 是因为这些动态加载的这些HTML页面(图二),是在列表数据页面(图一)的HTML元素,css,js代码加载完后,再添加的HTML元素,
在浏览器解析到图一的页面元素时, 解析到js的这些绑定标签事件的js代码(上面的JS代码)的时候,这些绑定事件的标签元素还没有生成,
(因为js代码加载完后,才会有这些绑定事件的标签),所以这些JS 代码的绑定的事件,根本就没有绑定到这些动态加载的标签上,所以哪些事件不会触发。
reference: https://www.cnblogs.com/heganlin/p/5848833.html
Flask ajax 动态html 的javascript 事件失效的更多相关文章
- 关于动态生成dom绑定事件失效的原因
之前做项目都是直接用jquery的bind绑定事件,不过当时都不是动态生成dom元素,而是已经页面中原本存在的dom元素进行事件绑定,最近在测试给动态生成的dom绑定事件的时候发现事件失效,于是就测试 ...
- 关于 js 动态生成html 绑定事件失效的问题
在实际问题中,也只到使用新版jq 的on 事件 进行动态元素的绑定: 是这样 (但是依然没有效果——): $('dom节点').on('click',function(){}) 之后经过查阅发现:正确 ...
- 解决jquery动态创建元素绑定事件失效问题
存在问题 在我们使用jquery动态创建元素后往往会遇到一些问题,如: 给.button按钮绑定了点击时间,执行alert:(1); 点击事件代码如下: <script>$("# ...
- 关于ajax请求后js绑定事件失效问题解决方法
<script> $(function(){ $(document).on('click', '.add' ,function(){ window.location.href=" ...
- 解决jQuery ajax动态新增节点无法触发点击事件的问题
在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢? 其实最简单的方法就是直接在标签中写onclick="" ...
- 《ajax学习》之ajax+JavaScript事件验证用户名是否可注册
当用户注册时,服务器数据库需要对用户输入的用户信息(以用户名为例子)进行验证,在不刷新页面的情况下又需要页面和服务器进行数据请求,最好的方法是用ajax异步请求. 一.实现思路: 1.用户输入信息 2 ...
- 移动端,ajax 动态加载的元素,为动态添加的一系列同个类名的元素添加点击事件
背景:一个列表页,有一系列同类名的元素,需要为每一个动态添加的列表项添加事件: 点击选择下图中不同的文档类型,再通过 ajax 动态加载不同的文档. 使用过的方法: 1.通知 jquery 的 $(s ...
- angularJs 多文件动态上传(删除其中一个文件的时候,要么file没被删除,要么删除了之后,点击事件失效)
<div cacModule.controller('CacScriptEditCtrl', CacScriptEditCtrl); CacScriptEditCtrl.$inject = [' ...
- (转)JAVA AJAX教程第二章-JAVASCRIPT基础知识
开篇:JAVASCRIPT是AJAX技术中不可或缺的一部分,所以想学好AJAX以及现在流行的AJAX框架,学好JAVASCRIPT是最重要的.这章我给大家整理了一些JAVASCRIPT的基础知识.常用 ...
随机推荐
- eclipse或Myeclipse中web项目没有run on server时怎么办?
文章转载至:http://blog.csdn.net/hongchangfirst/article/details/7722703 web项目没有run on server 1.首先确保正确安装Tom ...
- ZOJ 2770 Burn the Linked Camp 差分约束
链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do? problemCode=2770 Burn the Linked Camp Time Limi ...
- 五分钟学会 Kotlin 语法
为什么使用Kotlin 项目一期在收尾了终于有时间折腾了,一个多月以来Kotlin从入门到现在,坚持用来开发的切身感受.因为语法与Java的区别挺大的一开始很想放弃,如果不是因为项目在使用,想必很少人 ...
- python库numpy的reshape的终极解释
a = np.arange(2*4*4) b = a.reshape(1,4,4,2) #应该这样按反序来理解:最后一个2是一个只有2个元素的向量,最后的4,2代表4×2的矩阵,最 ...
- ajax异步请求返回对象
使用ajax异步请求返回一个对象. java code: @RequestMapping({"getAstSingleWheelImg_bbs"+Constant.JSON}) @ ...
- 知乎Live总结-重复nature文章笔记Single-cell
来自知乎Live-孟浩巍 1.文章重要技术及图讲解 首先在转录组RNA-seq中,有基因表达差异.基因融合.可变剪切.RNA单点突变. 在基因组中,单点变异.结构变异,CNV变异(拷贝数变异) 三类基 ...
- 看github上有18万star的第一开源项目如何教你学前端编程的
作为 Github | star 第一开源项目,已经超过18万 star:比之前最火的bootstrap的10万star还要多出8w,freeCodeCamp 越来越受关注,建站两年时间不到已经近40 ...
- SQL 函数以及SQL 编程
1.数学函数:操作一个数据,返回一个结果 --去上限: ceiling ☆select --去下限:floor ☆select floor(price) from car --ABS 绝对值 --PI ...
- javascript Date对象 之 时间转字符串
javascript Date对象 --> 时间转字符串: 测试代码: <!DOCTYPE html> <html lang="en"> <he ...
- C#属性器Get和Set
public sealed class classroom { private List<string> student = new List<string>(); priva ...