jquery on如何给未来元素绑定事件？

Zhuxy 发布于2019-08-22 11:06 / 2946人阅读

摘要：我们要想在一个元素上绑定一个事件，那么这个元素必须先存在，也就是绑定事件动作前就已有这个元素。声明原文来自求索网如何给未来元素绑定事件

我们要想在一个元素上绑定一个事件，那么这个元素必须先存在，也就是绑定事件动作前就已有这个元素。

这是一个给元素绑定任何事件的前提。

如果按照这种思路走，那么“给未来元素绑定事件”将会是一个死胡同。

我们跳出问题设定的思维陷阱，把元素绑在未来元素的父级上，那么这个问题就迎刃而解了。

demo如下：

html部分代码


    php
    javascript

js部分代码

$("button.add").click(function(){
    $("mysql").appendTo("ul.menu");
})

//给li绑定click事件
//记住不要把事件直接绑定在son元素上$(".son").on("click",function(){})
//正确的姿态：
$(".menu").on("click", ".son", function(){
    alert("正在进入...");
})

ok，拿这个demo尝试一下，是不是未来添加的几个菜单项都被绑定了点击事件了呢？没错，jquery on 绑定未来事件就是这么简单。

声明原文来自求索网:jquery on如何给未来元素绑定事件

云服务器 GPU云服务器 jquery绑定事件on jquery预绑定事件 jquery绑定hover事件 js如何去除事件绑定

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/91769.html

A01-jquery操作之：如何获取动态生成元素（获取未来元素）

摘要：如何获取元素列表进行遍历很简单直接在方法的回调函数中获取动态生成子元素你好啊将子元素加入父元素为子元素注册事件输出所有子元素 A01-jquery操作之：如何获取动态生成元素（获取未来元素） what 动态生成元素？ html代码中没有的元素通过js生成的元素通过模板字符串生成的元素反正就是页面加载后才生成的元素 why 传统的方直接使用$(选择器)无法获取到该元素...

wangym 2019-08-26 10:42 评论0 收藏0
【JavaScript系列】动态绑定事件方法：(1)jquery的on方法；(2)html元素绑定

摘要：提示如需移除事件处理程序，请使用方法。说明和绑定的点击事件被的事件覆盖。分析不同的绑定方式执行顺序属性元素事件事件。元素绑定事件删除按钮。属性绑定事件动态绑定事件方法的方法的属性绑定。一、动态监听加载对象当使用js或jQuery动态创建元素(例如append，appendChildren)，再用on(事件, function(){...})或addEventListener监听事件...

young.li 2019-08-26 10:20 评论0 收藏0
jQuery动画效果、jQuery插件使用

摘要：一事件的绑定与解绑的简单绑定事件新版本使用为指定的元素添加一个或多个事件处理程序，并规定当这个事件发生时运行的函数。将整个文件放至项目的任意目录不要移动其文件结构，它们具有完整的依赖体系。一、事件的绑定与解绑 1.1 jQuery的简单绑定 1.1.1 on(events,fn)事件(新版本使用) 为指定的元素添加一个或多个事件处理程序，并规定当这个事件发生时运行的函数。on()方法...

MkkHou 2019-08-29 16:16 评论0 收藏0
jQuery动画效果、jQuery插件使用

摘要：一事件的绑定与解绑的简单绑定事件新版本使用为指定的元素添加一个或多个事件处理程序，并规定当这个事件发生时运行的函数。将整个文件放至项目的任意目录不要移动其文件结构，它们具有完整的依赖体系。一、事件的绑定与解绑 1.1 jQuery的简单绑定 1.1.1 on(events,fn)事件(新版本使用) 为指定的元素添加一个或多个事件处理程序，并规定当这个事件发生时运行的函数。on()方法...

ssshooter 2019-08-23 10:40 评论0 收藏0
jQuery动画效果、jQuery插件使用

摘要：一事件的绑定与解绑的简单绑定事件新版本使用为指定的元素添加一个或多个事件处理程序，并规定当这个事件发生时运行的函数。将整个文件放至项目的任意目录不要移动其文件结构，它们具有完整的依赖体系。一、事件的绑定与解绑 1.1 jQuery的简单绑定 1.1.1 on(events,fn)事件(新版本使用) 为指定的元素添加一个或多个事件处理程序，并规定当这个事件发生时运行的函数。on()方法...

joyvw 2019-08-02 11:08 评论0 收藏0