`

live事件

JavaScript 
阅读更多

jQuery 给所有匹配的元素附加一个事件处理函数，即使这个元素是以后再添加进来的也有效。

这个方法是基本是的 .bind() 方法的一个变体。使用 .bind() 时，选择器匹配的元素会附加一个事件处理函数，而以后再添加的元素则不会有。为此需要再使用一次 .bind() 才行。比如说

<body>
  <div class="clickme">Click here</div>
</body>

可以给这个元素绑定一个简单的click事件：

$('.clickme').bind('click', function() {
  alert("Bound handler called.");
});

当点击了元素，就会弹出一个警告框。然后，想象一下这之后有另一个元素添加进来了。

$('body').append('<div class="clickme">Another target</div>');

尽管这个新的元素也能够匹配选择器 ".clickme" ，但是由于这个元素是在调用 .bind() 之后添加的，所以点击这个元素不会有任何效果。

.live () 就提供了对应这种情况的方法。如果我们是这样绑定click事件的：

$('.clickme').live
('click', function() {
  alert("Live
 handler called."); 
});

然后再添加一个新元素：

$('body').append('<div class="clickme">Another target</div>');

然后再点击新增的元素，他依然能够触发事件处理函数。

分享到：
| 网页选项卡
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    解析jQuery的三种bind/One/Live事件绑定使用方法

    本文将详细介绍jQuery中的三种事件绑定方法：bind、one和live，以及它们各自的特点和应用场景。 1. **bind**：`bind()` 是jQuery中最基础的事件绑定方法，它允许我们将事件处理器绑定到DOM元素上。例如，我们可以...

    LiveChart进阶版学习

    在压缩包中的"LiveCharts2-master"是LiveChart的最新版本，LiveCharts 2引入了更多的改进和新特性，比如性能优化、新的图表类型、更强大的数据绑定和事件处理机制。 1. 性能提升：LiveCharts 2对内部结构进行了优化...

    LiveCharts LiveCharts2

    6. **丰富的事件处理**：提供了丰富的事件接口，如鼠标点击事件、图表区域改变事件等，方便开发者扩展功能。 7. **性能优化**：尽管实时更新数据，但 LiveCharts 通过优化算法保持了良好的性能，即使处理大量数据也...

    html集成live2D,demo

    7. **与其他组件互动**：描述中的“触摸其他组件与人物互动”可能意味着Live2D模型不仅仅对自身的触摸事件作出响应，还能与网页上的其他元素（如按钮、文本框等）进行联动。例如，当用户点击某个按钮时，Live2D人物...

    在Vue中快速引入Live2d

    Live2D库提供了多种交互事件，如点击、触摸等。你可以在Vue组件中监听这些事件，添加自己的业务逻辑。例如，监听`loadModelSuccess`事件： ```javascript mounted() { live2dWidget.on('loadModelSuccess', () =...

    cocos creator 3.8.0 版本 Live2D 动画Demo

    5. **事件响应**：Cocos Creator允许你为Live2D模型设置事件监听器，这样当用户交互或其他游戏事件发生时，可以触发特定的动画或表情。 6. **性能优化**：由于Live2D动画涉及到大量的计算，优化是至关重要的。Cocos...

    livecharts控件大全，wpf界面开发使用教程

    同时，LiveCharts支持鼠标事件，如点击、悬停时显示提示信息，通过绑定事件处理函数实现交互功能。 6. **实时数据更新** 对于实时数据显示，LiveCharts提供了一套完善的机制。只需确保数据源（如`...

    jQuery：bind() delegate() live()事件绑定

    在探讨jQuery中的`bind()`, `delegate()`, 和`live()`事件绑定方法的区别时，我们需要深入理解它们在处理DOM事件时的独特方式。这些方法在不同的场景下提供了灵活且高效的选择，帮助开发者创建响应式和动态的Web应用...

    Live-Charts源码实列（C#多语言）

    - **事件处理**：监听图表的交互事件，如鼠标点击、悬停等，实现更丰富的用户交互。 6. **图表类型和示例** - **线图**：适合展示连续数据的变化趋势。 - **柱状图**：用于比较不同类别之间的数值差异。 - **...

    live555源码及转化成java的源码

    《深入理解Live555源码与Java转换实践》 在现代互联网技术中，实时流媒体占据了重要地位，而Live555作为一款开源的、跨平台的流媒体服务器库，为开发者提供了强大的功能支持。本文将围绕"live555源码及转化成java的...

    LIVE555,CMAKE版本，LINUX QT 环境下可用

    Qt的事件驱动模型和丰富的组件库使得创建直观的用户界面变得容易，同时，LIVE555负责处理底层的流媒体传输和解码。 在Linux运维中，这样的工具包可以帮助管理员建立自定义的流媒体服务器或者监控系统，实现对多媒体...

    jQuery中live方法的重复绑定说明

    解决：使用die()方法，在live()方法绑定前，将此元素上的前面被绑定的事件统统解除，然后再通过live()方法绑定新的事件。 代码如下: //先通过die()方法解除，... 如果不带参数，则所有绑定的live事件都会被移除。 你可

    live555源码20150807版本

    4. **事件驱动编程**：live555采用事件驱动模型，通过事件回调处理网络状态变化和数据传输，这是高性能网络应用的常见设计模式。 5. **内存管理和线程安全**：在处理多并发请求时，理解和掌握如何正确管理内存、...

    Live555源码以及编译好的exe执行程序

    3. **BasicUsageEnvironment**：这是一个轻量级的事件驱动环境，用于处理线程、定时器和I/O事件，是Live555运行的基础。 4. **Groupsock**：这个组件提供了多路复用的套接字支持，使得一个套接字可以同时处理多个...

    Live2DUnity2.1SDK压缩包

    它们展示了基本的动画控制、事件处理以及与其他游戏元素的交互等，是学习和调试的重要参考资料。 使用Live2DUnity2.1SDK，开发者可以轻松地在Unity3D游戏中创建生动的2D角色动画，提升游戏的艺术表现力和用户体验。...

    Arthas和LiveCharts的dll.zip

    对于Arthas，开发者可以使用其提供的控件类，例如`Arthas.DataGrid`，通过设置属性和事件来定制数据网格的行为。例如，可以通过绑定数据源、设置列宽、添加排序和过滤功能等，来满足不同场景的需求。 至于Live...

    LiveCharts样例

    LiveCharts的饼图允许开发者设置各个扇区的颜色、标签和值，同时支持鼠标悬停时显示详细信息，以及点击扇区触发事件等功能。这对于展现各部分占整体的比例非常有帮助。 接下来是**曲线图**，也称为折线图。在Live...

    C# 各种统计图实例大全(LiveChart).zip

    LiveChart提供了多种图表事件，如点击事件、数据更改事件等，方便开发人员根据需要添加交互逻辑。 总之，"C# 各种统计图实例大全(LiveChart).zip"这个资源包是一个学习LiveChart的好材料，通过实例项目，你可以...

    LiveChart.wpf Chart图表保存Image图片

    在.NET Framework中，LiveChart.wpf是一个用于创建交互式图表的库，它为WPF（Windows Presentation Foundation）应用程序提供了丰富的数据可视化功能。然而，LiveChart.wpf库本身并不直接提供将图表保存为图像文件...

Magicbox
Global site tag (gtag.js) - Google Analytics