$('.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 事件失效的更多相关文章

  1. 关于动态生成dom绑定事件失效的原因

    之前做项目都是直接用jquery的bind绑定事件,不过当时都不是动态生成dom元素,而是已经页面中原本存在的dom元素进行事件绑定,最近在测试给动态生成的dom绑定事件的时候发现事件失效,于是就测试 ...

  2. 关于 js 动态生成html 绑定事件失效的问题

    在实际问题中,也只到使用新版jq 的on 事件 进行动态元素的绑定: 是这样 (但是依然没有效果——): $('dom节点').on('click',function(){}) 之后经过查阅发现:正确 ...

  3. 解决jquery动态创建元素绑定事件失效问题

    存在问题 在我们使用jquery动态创建元素后往往会遇到一些问题,如: 给.button按钮绑定了点击时间,执行alert:(1); 点击事件代码如下: <script>$("# ...

  4. 关于ajax请求后js绑定事件失效问题解决方法

    <script> $(function(){ $(document).on('click', '.add' ,function(){ window.location.href=" ...

  5. 解决jQuery ajax动态新增节点无法触发点击事件的问题

    在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢? 其实最简单的方法就是直接在标签中写onclick="" ...

  6. 《ajax学习》之ajax+JavaScript事件验证用户名是否可注册

    当用户注册时,服务器数据库需要对用户输入的用户信息(以用户名为例子)进行验证,在不刷新页面的情况下又需要页面和服务器进行数据请求,最好的方法是用ajax异步请求. 一.实现思路: 1.用户输入信息 2 ...

  7. 移动端,ajax 动态加载的元素,为动态添加的一系列同个类名的元素添加点击事件

    背景:一个列表页,有一系列同类名的元素,需要为每一个动态添加的列表项添加事件: 点击选择下图中不同的文档类型,再通过 ajax 动态加载不同的文档. 使用过的方法: 1.通知 jquery 的 $(s ...

  8. angularJs 多文件动态上传(删除其中一个文件的时候,要么file没被删除,要么删除了之后,点击事件失效)

    <div cacModule.controller('CacScriptEditCtrl', CacScriptEditCtrl); CacScriptEditCtrl.$inject = [' ...

  9. (转)JAVA AJAX教程第二章-JAVASCRIPT基础知识

    开篇:JAVASCRIPT是AJAX技术中不可或缺的一部分,所以想学好AJAX以及现在流行的AJAX框架,学好JAVASCRIPT是最重要的.这章我给大家整理了一些JAVASCRIPT的基础知识.常用 ...

随机推荐

  1. django--博客--forms组件-用户注册

    ---------------------------------------------前端页面简易代码----------------------------------------------- ...

  2. 我的Android进阶之旅------>android中一些特殊字符(如:←↑→↓等箭头符号)的Unicode码值

    在项目中,有时候在一些控件(如Button.TextView)中要添加一些符号,如下图所示:                         这个时候可以使用图片的方式来显示,不过这些可以直接使用Un ...

  3. mysq查询语句包含中文以及中文乱码,字符集 GBK、GB2312、UTF8的区别

    一.查看mysql 字符集设置情况 使用Navicat for Mysql查看工具,打开命令列界面,输入show variables like '%char%';如下图,查看当前mysql字符集设置情 ...

  4. 使用ansible 完成yum安装lamp环境

    使用ansible 完成yum安装lamp环境 [root@node2 ~]# cd /etc/ansible/playbook/[root@node2 playbook]# lslamp[root@ ...

  5. php如何实现定时任务,php定时任务方法,最佳解决方案,php自动任务处理

    php如何实现定时任务,php定时任务方法,最佳解决方案,php自动任务处理 Joe PHP 2012-01-18 定时任务对于php来说一直都是很多朋友的一个难题,但却很多地方都遇到了.比如说:游戏 ...

  6. Nullable类型的问题处理

    public class Calc { public long? Number { get; set; } public long Number1 { get; set; } public long ...

  7. Phpstorm 换行设置(复制 http://jingyan.baidu.com/article/86fae346b2cb673c49121ad3.html)

    很多时候代码太长超出了屏幕的宽度,默认情况下没有自动换行的,我们需要把光标往后挪,才能看到后面代码,显得略为蛋疼,我个人比较喜欢能够自动换行. 下面就说下Phpstorm里如何默认开启自动换行(use ...

  8. libvirt-qemu-虚拟机设备热插拔

    cpu热插拔 # virsh setvcpus $domain_name --count 4 --live (--config可写入配置文件永久保存) #前提条件和后续激活参考<libvirt- ...

  9. Entity FrameWork Code First常用知识

    1.Model属性类: [Key] //标识一个属性作为主键,即使它不符合类名+Id的格式. [MaxLength(500)] //限制一个字符串属性最多有多少字,其对应的数据表字段也会是nvarch ...

  10. Stalstack 安装

    Stalstack 介绍 saltsack与shell自动化的区别 shell 自动化脚本 --> 串行 saltstack --> 并行 saltsack 平台管理插件 saltstac ...