事件处理器作为浏览器对象的属性
| ) * 3);
while (imgClicked.src.indexOf(myImages[newImgNumber]) != -1) { newImgNumber = Math.round(Math.random() * 3); } imgClicked.src = myImages[newImgNumber]; return false; } </script> </head> <body> <img name="img0" src="usa.gif" border="0" onclick="return changeImg(0)"> <img name="img1" src="mexico.gif" border="0" onclick="return changeImg(1)"> </body> </html> 将该页面保存为ch5_examp5.htm文件。要进行测试，我们还需要4个图片文件，你可以自己创建4幅图片，也可以从本书所提供的代码下载中获得这4幅图片。 在浏览器中加载该页面，代码的效果将如图5-3所示：
图 5-3 当单击某一幅图片，将会看到它变成了另一幅随机选取的图片。 代码解说 在上面的例子中，在页面代码的开始处定义了一个脚本块，并在脚本块的第一行定义了一个页面级变量myImages。该变量是一个包含各图片名称字符串的数组。如下所示： var myImages = new Array("usa.gif","canada.gif","jamaica.gif","mexico.gif"); 接着定义了changeImg()函数，该函数将被用来连接到页面图片的<IMG>标记的onclick事件处理器。在这里，我们将两个图片的onclick事件处理器都连接到同一事件处理函数，实际上，我们可以将任意多个事件处理器连接到同一个函数。changeImg()函数可以接受一个参数，该参数表示触发click事件的img对象在images数组中的索引值—— 通过该参数我们就知道需要对哪一个被单击了的图片进行处理。 在changeImg()函数的第一行，定义了一个变量imgClicked，该变量引用了被单击的图片所对应的img对象。传入的imgNumber参数表示触发click事件的img对象在images数组中的索引值，因此通过document.images[imgNumber]就能得到被单击的图片所对应的img对象。相应的代码如下所示： function changeImg(imgNumber) { var imgClicked = document.images[imgNumber]; 接下来，把变量newImgNumber的值设置为一个0～3之间的随机数。Math.random()方法将返回一个0～1之间的随机数，只需再乘以3，即Math.random() * 3就能得到一个0～3之间的随机数。然后，使用了Math.round()方法对其进行四舍五入，就可以得到一个0～3之间的整数(即0、1、2或3)。用这个随机的整数 |
凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务，公司网站：http://www.lingzhong.cn 为了给广大客户了解更多的技术信息，本技术文章收集来源于网络,凌众科技尊重文章作者的版权，如果有涉及你的版权有必要删除你的文章，请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息，谢谢! |
