javascript DOM绑定事件

2026-08-02

Js为Dom元素绑定事件须知

为异步加载的Dom 元素绑定事件必须在加载完成之后绑定: $('body').load('LearnClickBinding.ashx');$('a').click(function () { alert('I was clicked!'); }); 上面的绑定是无效的,因为异步加载需要时间,而在获取元素之前,早已执行了$('a').click();方法,所以绑定失败. 正确的做法是,等待元素加载完后再执行 $('a').click(); $('body').load('LearnClickBi

JavaScript Dom 绑定事件

JavaScript Dom 绑定事件 // 先获取Dom对象,然后进行绑定 document.getElementById('xx').onclick document.getElementById('xx').onfocus // 谁调用这个函数,这个this就指向谁 this:当前出发事件的标签.全局对象 window 一.绑定方式 <input id='i1' type='button' onclick='ClickOn(this)'> function ClickOn(this){

JavaScript(1)---绑定事件、解除绑定事件

JavaScript(1)---绑定事件.解除绑定事件一.事件概述 1.事件的几个概念 · 事件指的是文档或者浏览器窗口中发生的一些特定交互瞬间.我们可以通过侦听器(或者处理程序)来预定事件,以便触发事件的时候执行相应的代码. 事件处理程序我们用户在页面中进行的点击动作(click).鼠标移动动作(mousemove)等,都可以称之为事件名称.响应某个事件的函数则称为事件处理程序,或者叫做事件侦听器. 事件类型 UI事件: load.unload.error.resize.scroll.s

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

之前做项目都是直接用jquery的bind绑定事件,不过当时都不是动态生成dom元素,而是已经页面中原本存在的dom元素进行事件绑定,最近在测试给动态生成的dom绑定事件的时候发现事件失效,于是就测试了一下: 1.事件失效的原因:(1)bind事件绑定只对dom中存在的元素有效,对于我们后来动态增加的元素是监测不到,所以绑定不了 (2)同样,当你使用var aa = document.getElementsByTagName("动态生成的元素");来获取动态生成的元素的时候也是获取不到

JavaScript中绑定事件监听函数的通用方法addEvent() 和事件绑定之bindEvent()与 unBindEvent()函数

下面绑定事件的代码,进行了兼容性处理,能够被所有浏览器支持: function addEvent(obj,type,handle){ try{ // Chrome.FireFox.Opera.Safari.IE9.0及其以上版本 obj.addEventListener(type,handle,false); }catch(e){ try{ // IE8.0及其以下版本 obj.attachEvent('on' + type,handle); }catch(e){ // 早期浏览器 obj['o

jquery每次动态加载dom,绑定事件会多一次,

jquery绑定事件,每次动态加载dom,绑定的事件会加1,比如动态加载dom5次,点那个点击事件会弹出5次解决办法就是在每次绑定之前解绑定. $('.seek-footer .btn1').off('click'); // 先解绑 $('.seek-footer .btn1').on('click',function () {}) 再绑定

javascript元素绑定事件

js元素绑定事件想给一个元素绑定一个方法之后,在绑定一个方法而且不被覆盖 window.onload = function () { alert('a'); } window.onlaod=function(){ alert('b') } 我们发现它只弹出一个,有一个被覆盖了下面就说一下js中的绑定事件 attachEvent(IE中用) var oBtn = document.getElementById('btn1'); oBtn.attachEvent('onclick', fun

Jquery获取DOM绑定事件

获取到当前正在执行的事件: $('#testDive').bind('click', function(event){alert('event: ' + event.type)}); 获取所有绑定事件: $._data(document.getElementById('testDive'), 'events');

JavaScript DOM 注册事件

一个HTML是一个DOM树,每一个节点都是DOM对象,整个HTML其实也是一个DOM对象,根节点是<html>; 在HTML页面初始化的时候,JavaScript会自动帮DOM对象注册消息(addEventListener,事件绑定),如果使用JavaScript的语法来创建节点也会自动注册消息.但是如果是通过String来添加的节点,那么该String里面的DOM就不会被自动注册消息,需要自行注册,不然就不能使用默认的事件绑定. 比如<button type="buttom&

DOM绑定事件

addEventListener(event,function,useCapture)event:事件名,比如clickuseCapture布尔值,指定事件是否在捕获或冒泡阶段执行. 可能值: true - 事件句柄在捕获阶段执行 false- false- 默认.事件句柄在冒泡阶段执行 IE特有的target.attachEvent(type, listener); target: 文档节点.document.window 或 XMLHttpRequest. type: 字符串,事件名称,含“

DOM 绑定事件

// 1.获取事件源 var oDiv = document.getElementById('box'); console.log(oDiv); //2.事件 (1)直接绑定匿名函数 oDiv.onclick = function(){ // 3.事件驱动 alert(1);

[javascript]jQuery绑定事件方法：on()

语法: $(selector).on(event,childSelector,data,function) on(event,childSelector,data,function):在被选元素及子元素上添加一个或多个事件处理程序. 1.参数含义 event 必需.规定要从被选元素移除的一个或多个事件或命名空间. 由空格分隔多个事件值,也可以是数组.必须是有效的事件. childSelector 可选.规定只能添加到指定的子元素上的事件处理程序(且不是选择器本身,比如已废弃的 delegate(

jquery后加Dom绑定事件

$('#musicCategoryListContainer').on('click', '.musicCategoryItem', function () { $(this).siblings().removeClass("musicCategoryChecked"); $(this).addClass("musicCategoryChecked"); //alert($(($(this).find(".data"))[0]).attr(&qu

随笔一个dom节点绑定事件

以下利用jquery说明: js中,给一个dom节点绑定事件再平常不过了.这里说下,如果dom经常发生变化的话,给这个dom绑定事件的情况. 比如代码如下: li的节点,绑定了事件:点击会打出来里头的html内容. button点击事件:会生成一个li节点. <html> <head> <meta charset="UTF-8"> </head> <body> <ul class="ul"> &

day51—JavaScript绑定事件

转换学开发,代码100天——2018-05-06 今天学习JavaScript的绑定事件.因为浏览器的原因绑定事件需要考虑兼容性问题. attachEvent IE浏览器 ,ie9以上事件执行顺序与绑定顺序相同:ie9以下事件执行顺序与绑定顺序相反 btn.attachEvent("onclick",function(){ alert("a"); }); detachEvent btn.detachEvernt("onclick",f

Angular如何给动态生成的元素绑定事件

在AngularJS中,操作DOM一般在指令中完成,事件监听机制是在对于已经静态生成的dom绑定事件,而如果在指令中动态生成了DOM节点,动态生成的节点不会被JS事件监听. 举例来说: angular.module('myapp',[]) .directive('myText',function(){ return{ restrict:'A', template:'<div ng-click="hello()">Hi everyone</div>', link:

javascript DOM 操作基础知识小结

经常用到javascript对dom,喜欢这方便的朋友也很多,要想更好的对dom进行操作,这些基础一定要知道的. DOM添加元素,使用节点属性 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.

2017年3月25日工作日志：Jquery使用小结[绑定事件判断、select标签、军官证正则]

jQuery获取DOM绑定事件在1.8.0版本之前,我们要想获取某个DOM绑定的事件处理程序可以这样: $.data(domObj,'events');//或者$('selector').data('events') 而从1.8.0版本开始,jQuery突然不支持这样使用了,而是改到了一个叫'_data'的函数功能上了,即1.8.0及以后的版本你可以这么用: $._data(domObj,'events'); 要想写出兼容兼容各个jQuery版本的方式,这样获取即可: var eventsDa

2014年辛星解读Javascript之DOM之事件及其绑定

我们通过DOM的事件能够对HTML的事件作出反应.就像我们用其它编程语言写GUI一样,那么HTML包含哪些事件呢?以下是几个常见的样例,比方网页已经完毕记载,图像完毕载入,鼠标移动到元素上方.输入文字被改变.表单提交.用户点击按键等等,还是蛮多的. 以下我们用实例来演示一下,看以下的HTML代码: <html> <p id = "tag" onclick="this.innerHTML ='小倩' ">辛星</p> </ht

python之路43 JavaScript语法BOM与DOM jQuery对比标签绑定事件

前戏到目前为止,我们已经学过了JavaScript的一些简单的语法.但是这些简单的语法,并没有和浏览器有任何交互. 也就是我们还不能制作一些我们经常看到的网页的一些交互,我们需要继续学习BOM和DOM相关知识. JavaScript分为 ECMAScript,DOM,BOM. BOM(Browser Object Model)是指浏览器对象模型,它使 JavaScript 有能力与浏览器进行"对话". DOM (Document Object Model)是指文档对象模型,通过它,可

JavaScript实现绑定DOM的定时器插件

问题使用原生的setTimeout和setInterval仅仅能够实现, 定时执行事件处理函数, 在网页开发中, 往往会出现一种情况,定时器用于定时更新某个页面区域的数据, 往往在页面加载之后, 就启动这个定时器, 往后则间隔执行此定时器. 页面上定时刷新的区域可能会动态消失, 特别是在ajax被广泛使用的今天, 如果定时刷新的区域被删除了, 则定时器材也需要自动清除掉. 此二个接口,如果实现这种效果需要, 自己维护定时器句柄, 并且在处理定时器事件函数的时候, 首先判断指定的刷新区域是否还

javascript DOM绑定事件

热门专题