<!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. 查看和杀死进程ps

    $ps -ef #查看执行的进程. $ps -aux | grep java #查看java进程 $sudo kill 进程号 [1] http://www.cnblogs.com/peida/arc ...

  2. Bloom Filter 算法简介 (增加 Counting Bloom Filter 内容)

    Bloom Filter的中文翻译叫做布隆过滤器,是1970年由布隆提出的.它实际上是一个很长的二进制向量和一系列随机映射函数.布隆过滤器可以用于检索一个元素是否在一个集合中.它的优点是空间效率和查询 ...

  3. ORACLE中的FTP例子代码

    http://blog.csdn.net/mashengwang/article/details/5982663 CREATE OR REPLACE DIRECTORY my_docs AS '/u0 ...

  4. Linux-帮助与基本命令

    1.获取命令帮助 Linux中的命令按可分类shell内嵌命令.外部命令,获取命令帮助信息前需要区分命令类型. 1.1 type - 查看命令类型 [root@VM_0_171_centos ~]# ...

  5. Maven的阿里云镜像

    打开“Maven安装目录/conf/settings.xml”文件,找到<mirrors>节点,添加: <mirror> <id>nexus-aliyun</ ...

  6. 实验4 IIC通讯与EEPROM接口

    1.       用C语言编程,利用定时器产生一个0~99秒变化的秒表,并且显示在数码管上,每过一秒将这个变化写入实验板上AT24C02,当关闭实验板电源,并再次打开实验板电源时,单片机从AT24C0 ...

  7. Python：windows下scikit-learn 安装和更新

    scikit-learn 报错: from sklearn.model_selection import train_test_split ImportError: No module named m ...

  8. ASP .Net C# ---Excel导入导出方法

    导入导出的方法以及引用,可以自行创建一个帮助类 using System;using NPOI.SS.UserModel;using NPOI.XSSF.UserModel;using NPOI.HS ...

  9. AngularJs创建自定义Service

    AngularJs可以创建自定义的service.下面的自定义service实现一个double倍数的服务: 参考下面语法: app.service('double', function () { t ...

  10. 背水一战 Windows 10 (46) - 控件（ScrollViewer 基础）: ScrollViewer, ScrollBar, ScrollContentPresenter

    [源码下载] 背水一战 Windows 10 (46) - 控件(ScrollViewer 基础): ScrollViewer, ScrollBar, ScrollContentPresenter 作 ...