`
西北小强
  • 浏览: 342994 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js事件代理demo

阅读更多

最近做项目时遇到这样一个问题,需要给若干个<A>标签添加事件,由于需要添加事件的位置比较多,为了提高js的效率,同事建议使用js事件代理来写。刚查资料写了一个demo先做个笔记,有需要的朋友可以看看。下边是事件代理的核心js代码,当然光看这一段很少有人能看懂,附件里有完整的demo,需要的话自己看看,希望对你有所帮助。

 <script type="text/javascript">
	cityOnClick();

 function cityOnClick(){
	var cityul=document.getElementsByClassName("c_com"); //根据class名选择所有ul
	for(var i=0;i<cityul.length;i++){
		cityul[i].onclick =function(e){
		var e = e || window.event;  
		var Target = e.srcElement || e.target;  // srcElement这个只是支持firefox(获取触发对象的元素)  
		    alert("点击标签名:"+Target.tagName);  
			if( Target.tagName.toUpperCase() == "A" ){  
				  alert( Target.innerHTML );
				  alert(Target.name);
			 }; 
			}
		}	
	}
</script>

 

分享到:
评论

相关推荐

    代理demo的实现

    对通过该功能的实现,简单明了得阐述了代理的相关用法以及语法特征,适合新手观看

    微信小程序demo:商城分销系统(源代码+截图)

    微信小程序demo:商城分销系统(源代码+截图)微信小程序demo:商城分销系统(源代码+截图)微信小程序demo:商城分销系统(源代码+截图)微信小程序demo:商城分销系统(源代码+截图)微信小程序demo:商城分销系统(源代码+...

    树形表格 treetable 完整版 带演示demo例子

    对网上的树形表格treeTable进行了二次开发扩展,带演示demo例子

    demo:有一些html,vue.js演示

    10、js使用代理完成自定义验证组件: 11、CSS3动画demo,笔记总结: 12、想试试写写好看的界面,和自己喜欢听的歌结合起来,总的来说,还是挺满意的,(#^.^#), 13、杨辉三角demo,可以输入不同的值生成相应的图案,...

    iOS WebView与Js 交互Demo

    iOS 用UIWebView的代理实现与Js的交互,代码简单,方便易懂

    详解javascript设计模式三:代理模式

    但在javascript中,代理模式最常用到的两种方法是虚拟代理和缓存代理。 虚拟代理 在理解虚拟代理时,可以将其想象为一个经纪人,客户程序需要通过这个虚拟代理(经纪人)来调用本体对象的方法。 虚拟代理示例demo1: ...

    ucool-2.4 一款用于前端调试(特别bug-fix包括js,css)的代理服务器,基于Apache Tomcat,通过它可以将线上的js,css从压缩状态变成源码状态

    代理css和js文件,摆脱demo地址在应用中修改的困扰(不管本地和虚拟机,都可以了) 2.本地调试/demo里的jsonp,不用修改url,不用开启fiddler 3.配置文件切换debug功能,可以强制显示source文件

    draft-demo:draft.js开发的编辑器demos,包含自定义样式、自定义组件、entity、decorator等功能的示例

    该项目是通过引导的。 ...配置代理后出现“无效的主机头”错误 手动配置代理 配置WebSocket代理 在开发中使用HTTPS 在服务器上生成动态&lt;meta&gt;标记 预渲染为静态HTML文件 将数据从服务器注入

    Java SSM框架集成的日志功能增强Demo源码

    项目名称:Java SSM框架集成日志功能增强Demo 主要编程语言:Java 技术栈包含: - Java - JavaScript - CSS - HTML 文件概览: - 总计文件数:86个 - Java源文件:26个 - XML配置文件:16个 - JavaScript脚本...

    微信小程序-微信web开发工具 demo 破解抢先版

    注意如果运行后,网络资源请求出错,请关闭代理! 开发文档 http://notedown.cn/weixin/component/ 开发工具下载: Win版本下载:https://pan.baidu.com/s/1jIygQCe 密码: ccy5 Mac版本下载:...

    vue-cli3.0配置demo更新

    vue-cli3.0配置demo,vue.config.js的具体配置,代码解释明确,以及配置别名,配置代理跨域,vue配置devServer

    使用JavaScript和MQTT实现的一个简单的物联网应用

    该Demo是一个使用JavaScript和MQTT协议实现的物联网应用示例,展示了一个完整的物联网系统的基本架构和流程。该应用包含四个主要部分:客户端(Client)、代理服务器(Broker)、服务端(Server)和应用端(App)。 客户端...

    Silverlight2.0功能展示Demo源码

    Silverlight2.0功能展示Demo源码 1、Silverlight(3) - 2.0控件之Border, Button, Calendar, Canvas, CheckBox, ComboBox 介绍 Silverlight 2.0 控件一览:Border, Button, Calendar, Canvas, CheckBox, ComboBox 2...

    tensorflowjs-demo

    该项目是通过引导的。... 使用AJAX请求获取数据与API后端集成节点Ruby on Rails 在开发中代理API请求配置代理后出现“无效的主机头”错误手动配置代理配置WebSocket代理在开发中使用HTTPS 在服务器上生成动态&lt;met

    passport-demo

    添加数据库信息作为新文件 /config/database.js 与module.exports = {"url": "mongodb://&lt;YOUR&gt;:&lt;YOUR&gt;@&lt;YOUR&gt;/&lt;YOUR&gt;"} 对于开发,从nodemon server.js开始。 否则,从node server.js或npm start ##角度路由 ...

    SHH整合(mysql,struts2 2.2+spring2.5+hibernate3.0,log,jquery,标签等)DEMO

    3、整合日志管理配置,及Spring代理日志管理的配置及应用 4、应用WEB前段主流技术,js与JQuery 运用JQuery初始化加载数据,js登陆 显示层应用多少方式,例如Session显示用户,EL应用,jsp内置对象应用 使用主流的...

    ABP(2.02)框架相关Demo代码以及报错处理和中文说明手册

    自动创建Javascript 的代理层来更方便使用Web Api 封装一些Javascript 函数,更方便地使用ajax、消息框、通知组件、忙状态的遮罩层等等 除ABP框架项目以外,还开发了名叫“Zero”的模块,实现了以下功能: 身份...

    ali-data-proxy-lite-demo:阿里数据代理精简版演示

    demo 演示说明第一步$ node basicUsageDemo.js第二步打开浏览器,访问第三步打开浏览器控制台 查看输出结果查看带cookie的请求及回写第一步sudo vim /etc/hosts插入 127.0.0.1 local.taobao.com第二步访问第三步打开...

    利用window.name跨域解决方案Demo.rar

    本Demo实现了一个来自不同服务器的前端页面集成方案,页面间通过window窗口关系形成父子页面关系,跨域情况下父子页面间彼此看不见对方的DOM和js对象,无法直接进行数据交互。本方案从父页面到子页面数据传递采用url...

Global site tag (gtag.js) - Google Analytics