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的基础知识.常用 ...
随机推荐
- django--博客--forms组件-用户注册
---------------------------------------------前端页面简易代码----------------------------------------------- ...
- 我的Android进阶之旅------>android中一些特殊字符(如:←↑→↓等箭头符号)的Unicode码值
在项目中,有时候在一些控件(如Button.TextView)中要添加一些符号,如下图所示: 这个时候可以使用图片的方式来显示,不过这些可以直接使用Un ...
- mysq查询语句包含中文以及中文乱码,字符集 GBK、GB2312、UTF8的区别
一.查看mysql 字符集设置情况 使用Navicat for Mysql查看工具,打开命令列界面,输入show variables like '%char%';如下图,查看当前mysql字符集设置情 ...
- 使用ansible 完成yum安装lamp环境
使用ansible 完成yum安装lamp环境 [root@node2 ~]# cd /etc/ansible/playbook/[root@node2 playbook]# lslamp[root@ ...
- php如何实现定时任务,php定时任务方法,最佳解决方案,php自动任务处理
php如何实现定时任务,php定时任务方法,最佳解决方案,php自动任务处理 Joe PHP 2012-01-18 定时任务对于php来说一直都是很多朋友的一个难题,但却很多地方都遇到了.比如说:游戏 ...
- Nullable类型的问题处理
public class Calc { public long? Number { get; set; } public long Number1 { get; set; } public long ...
- Phpstorm 换行设置(复制 http://jingyan.baidu.com/article/86fae346b2cb673c49121ad3.html)
很多时候代码太长超出了屏幕的宽度,默认情况下没有自动换行的,我们需要把光标往后挪,才能看到后面代码,显得略为蛋疼,我个人比较喜欢能够自动换行. 下面就说下Phpstorm里如何默认开启自动换行(use ...
- libvirt-qemu-虚拟机设备热插拔
cpu热插拔 # virsh setvcpus $domain_name --count 4 --live (--config可写入配置文件永久保存) #前提条件和后续激活参考<libvirt- ...
- Entity FrameWork Code First常用知识
1.Model属性类: [Key] //标识一个属性作为主键,即使它不符合类名+Id的格式. [MaxLength(500)] //限制一个字符串属性最多有多少字,其对应的数据表字段也会是nvarch ...
- Stalstack 安装
Stalstack 介绍 saltsack与shell自动化的区别 shell 自动化脚本 --> 串行 saltstack --> 并行 saltsack 平台管理插件 saltstac ...