<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <title>用this传递当前对象本身</title>

    <meta charset="utf-8" />

</head>

<body>

<img src="usa.gif" onclick="changeImg(this)" alt=""/>

<img src="mexico.gif" onclick="changeImg(this)" alt=""/>

<script>

    var myImages = [

        "usa.gif",

        "canada.gif",

        "jamaica.gif",

        "mexico.gif"

    ];

    function changeImg(that) {

        var newImgNumber = Math.round(Math.random() * 3);

        //确保随机生成的图片索引不和当前的一样

        while (that.src.indexOf(myImages[newImgNumber]) != -1) {

            newImgNumber = Math.round(Math.random() * 3);

        }

        that.src = myImages[newImgNumber];

    }

</script>

</body>

</html>

　　

JavaScript事件-this传递的更多相关文章

  1. JavaScript 绑定事件时传递数据

    var data = { name: 'Ruchee', email: 'my@ruchee.com' }; data.handleEvent = function (e) { console.log ...

  2. 【移动端兼容问题研究】javascript事件机制详解（涉及移动兼容）

    前言 这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高 如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获 在下才疏学浅, ...

  3. 【repost】JavaScript 事件模型 事件处理机制

    什么是事件? 事件(Event)是JavaScript应用跳动的心脏 ,也是把所有东西粘在一起的胶水.当我们与浏览器中 Web 页面进行某些类型的交互时,事件就发生了.事件可能是用户在某些内容上的点击 ...

  4. JavaScript事件详解-jQuery的事件实现（三）

    正文 本文所涉及到的jQuery版本是3.1.1,可以在压缩包中找到event模块.该篇算是阅读笔记,jQuery代码太长.... Dean Edward的addEvent.js 相对于zepto的e ...

  5. JavaScript事件详解-Zepto的事件实现（二）【新增fastclick阅读笔记】

    正文 作者打字速度实在不咋地,源码部分就用图片代替了,都是截图,本文讲解的Zepto版本是1.2.0,在该版本中的event模块与1.1.6基本一致.此文的fastclick理解上在看过博客园各个大神 ...

  6. 解析Javascript事件冒泡机制

    本资源引自: 解析Javascript事件冒泡机制 - 我的程序人生 - 博客频道 - CSDN.NET http://blog.csdn.net/luanlouis/article/details/ ...

  7. Javascript事件机制兼容性解决方案

    本文的解决方案可以用于Javascript native对象和宿主对象(dom元素),通过以下的方式来绑定和触发事件: 或者 var input = document.getElementsByTag ...

  8. 【探讨】javascript事件机制底层实现原理

    前言 又到了扯淡时间了,我最近在思考javascript事件机制底层的实现,但是暂时没有勇气去看chrome源码,所以今天我来猜测一把 我们今天来猜一猜,探讨探讨,javascript底层事件机制是如 ...

  9. JavaScript——事件模型

    DOM事件流: DOM(文档对象模型)结构是一个树型结构,当一个HTML元素产生一个事件时,该事件会在元素结点与根节点之间按特定的顺序传播,路径所经过的节点都会收到该事件,这个传播过程可称为DOM事件 ...

随机推荐

  1. ZUFE2483 DO IT YOURSELF 2017-05-31 14:41 40人阅读 评论(0) 收藏

    2483: DO IT YOURSELF 时间限制: 2 Sec  内存限制: 128 MB 提交: 8  解决: 3 [提交][状态][讨论版] 题目描述 有四个字符串S,T,tmp,ans,一开始 ...

  2. nodes 验证码

    一个常见的需求. 知乎上得讨论:http://www.zhihu.com/question/32156977 node-canvas 在mac上安装有问题,可能是我没有sudo 使用了ccap:挺不错 ...

  3. hdu5016

    题意:给定一个n个点的图,这个图是一棵树,然后有些点建立了集市.并且没有集市的地方去集市一定是去最近的,如果距离相同,那么则去标号最小的..现在你还能在建一个集市,问建完这个集市最多有多少个点来这里. ...

  4. Android Studio-引用jar及so文件

    一.引用jar文件    1.将jar文件复制.粘贴到app的libs目录中:    2.右键点击jar文件,并点击弹出菜单中的“Add As Library”,将jar文件作为类库添加到项目中:  ...

  5. 简单创建一个“嗨新房”的mac客户端

    下载地址:https://github.com/mapanguan/Mac_HiNewHouse                

  6. Java学习--数组的定义和使用

    1. 数组分配了空间,未赋值 public class ArrayDemo01{ public static void main(String args[]){ int score[] = null ...

  7. 分形之龙形曲线（Dragon Curve）

    龙形曲线(Dragon Curve)又叫分形龙,是一种自相似碎形曲线的统称,因形似龙的蜿蜒盘曲而得名. 一种简单的生成分形龙的方式是:拿着一条细长的纸带,把它朝下的一头拿上来,与上面的一头并到一起.用 ...

  8. 【系统架构】亿级Web系统搭建（1）：Web负载均衡

    当一个Web系统从日访问量10万逐步增长到1000万,甚至超过1亿的过程中,Web系统承受的压力会越来越大,在这个过程中,我们会遇到很多的问题.为了解决这些性能压力带来问题,我们需要通过搭建不同的服务 ...

  9. c#中快速排序的学习

    最近看了一句话,说的是在现实生活中,会写字的人不见得会写出好文章,学习编程语言就像是学会了写字,学会了编程语言并不一定能写出好程序. 我觉得就是很有道理,以前读书的时候,基本学完了C#中的语法知识,算 ...

  10. nginx,gunicorn常用命令

    nginx 启动: 在下载nginx的目录下直接输入nginx回车 停止: nginx -s stop 重启: nginx -s reload 查看当前运行进程: ps -ef | grep ngin ...