分享web开发知识

注册/登录|最近发布|今日推荐

主页 IT知识网页技术软件开发前端开发代码编程运营维护技术分享教程案例
当前位置:首页 > 教程案例

jQuery绑定事件

发布时间:2023-09-06 01:08责任编辑:熊小新关键词:jQuery

1.事件绑定的方式

事件DOM:三种绑定方式jQuery:#前面几种调用的全是on$(‘.c1‘).click()$(‘.c1‘).bind(‘click‘,function(){})$(‘.c1‘).unbind(‘click‘,function(){})$(‘.c1‘).delegate(‘a‘,‘click‘,function(){}) #不同于其它,有委托的作用$(‘.c1‘).undelegate(‘a‘,‘click‘,function(){})$(‘.c1‘).on(‘click‘,function(){})$(‘.c1‘).off(‘click‘,function(){})

2. 由于程序是从上往下执行,所以对新输入的没有绑定alert事件。

<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title></head><body> ???<input id="t1" type="text"/> ???<input id="a1" type="button" value="添加"/> ???<ul id="ul"> ???????<li>123</li> ???????<li>456</li> ???</ul> ???<script src="jquery-1.12.4.js"></script> ???<script> ???????$(‘#a1‘).click(function(){ ???????????var v=$(‘#t1‘).val(); ???????????var temp="<li>"+v+"</li>"; ???????????$(‘#ul‘).append(temp); ???????}); ???????$(‘ul li‘).click(function(){ ???????????v=$(this).text(); ???????????alert(v); ???????}) ???</script></body></html>

  所以需要重新绑定

3. delegate具有委托的作用,不同于其它几个。

click不行,bind不行,on不行,delegate可以。委托。

<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title></head><body> ???<input id="t1" type="text"/> ???<input id="a1" type="button" value="添加"/> ???<ul id="ul"> ???????<li>123</li> ???????<li>456</li> ???</ul> ???<script src="jquery-1.12.4.js"></script> ???<script> ???????$(‘#a1‘).click(function(){ ???????????var v=$(‘#t1‘).val(); ???????????var temp="<li>"+v+"</li>"; ???????????$(‘#ul‘).append(temp); ???????}); ???????$(‘ul‘).delegate(‘li‘,‘click‘,function(){ ???????????v=$(this).text(); ???????????alert(v); ???????}) ???</script></body></html>

jQuery绑定事件

原文地址:http://www.cnblogs.com/momo8238/p/7469738.html

知识推荐

我的编程学习网——分享web前端后端开发技术知识。 垃圾信息处理邮箱 tousu563@163.com 网站地图
icp备案号 闽ICP备2023006418号-8 不良信息举报平台 互联网安全管理备案 Copyright 2023 www.wodecom.cn All Rights Reserved