JS实现页面中所有img对象添加onclick事件及新窗口查看图片的方法


Posted in Javascript onDecember 27, 2016

本文实例讲述了JS实现页面中所有img对象添加onclick事件及新窗口查看图片的方法。分享给大家供大家参考,具体如下:

这里演示js如何给页面中所有的img对象加上onclick事件,且实现在新窗体中查看该图片文件的功能:

<script type="text/JavaScript" language="javascript">
<!--
     ///给页面中所有img对象添加onclick事件
     //author:aganar
     ///
    function AddImgClickEvent()
    {
      var objs = document.getElementsByTagName("img");
      for(var i=0;i<objs.length;i++)
      {
        objs[i].onclick=function()
        {
          window.open(this.src);
        }
        objs[i].style.cursor = "pointer";
      }
    }
    AddImgClickEvent();
// -->
</script>

效果如下图所示:

JS实现页面中所有img对象添加onclick事件及新窗口查看图片的方法

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
两种简单实现菜单高亮显示的JS类代码
Jun 27 Javascript
基于jquery的合并table相同单元格的插件(精简版)
Apr 05 Javascript
IE6,IE7,IE8下使用Javascript记录光标选中范围(已补全)
Aug 28 Javascript
table对象中的insertRow与deleteRow使用示例
Jan 26 Javascript
javascript页面上使用动态时间具体实现
Mar 18 Javascript
下拉框select的绑定示例
Sep 04 Javascript
详解JavaScript函数
Dec 01 Javascript
怎么引入(调用)一个JS文件
May 26 Javascript
javascript十六进制数字和ASCII字符之间的转换方法
Dec 27 Javascript
将input框中输入内容显示在相应的div中【三种方法可选】
May 08 Javascript
vue实现点击展开点击收起效果
Apr 27 Javascript
vue 导出文件,携带请求头token操作
Sep 10 Javascript
JS使用正则实现去掉字符串左右空格的方法
Dec 27 #Javascript
js使用Replace结合正则替换重复出现的字符串功能示例
Dec 27 #Javascript
easyUI实现类似搜索框关键词自动提示功能示例代码
Dec 27 #Javascript
jQuery获取选中单选按钮radio的值
Dec 27 #Javascript
JS前向后瞻正则表达式定义与用法示例
Dec 27 #Javascript
jQuery中弹出iframe内嵌页面元素到父页面并全屏化的实例代码
Dec 27 #Javascript
TypeScript学习之强制类型的转换
Dec 27 #Javascript
You might like
PHP 输出缓存详解
2009/06/20 PHP
fckeditor上传文件按日期存放及重命名方法
2015/05/22 PHP
AES加解密在php接口请求过程中的应用示例
2016/10/26 PHP
tp5(thinkPHP5)框架实现多数据库查询的方法
2019/01/10 PHP
javascript在一段文字中的光标处插入其他文字
2007/08/26 Javascript
基于jquery的图片懒加载js
2010/06/30 Javascript
基于jquery的无缝循环新闻列表插件
2011/03/07 Javascript
ECMAScript 创建自己的js类库
2012/11/22 Javascript
ie下jquery.getJSON的缓存问题的处理方法
2013/03/29 Javascript
JavaScript按值删除数组元素的方法
2015/04/24 Javascript
jQuery实现自动切换播放的经典滑动门效果
2015/09/12 Javascript
jQuery中show与hide方法用法示例
2016/09/16 Javascript
js html5 css俄罗斯方块游戏再现
2016/10/17 Javascript
angular中的http拦截器Interceptors的实现
2017/02/21 Javascript
axios简单实现小程序延时loading指示
2018/07/30 Javascript
webuploader分片上传的实现代码(前后端分离)
2018/09/10 Javascript
Async/Await替代Promise的6个理由
2019/06/15 Javascript
Vue中图片Src使用变量的方法
2019/10/30 Javascript
webpack 最佳配置指北(推荐)
2020/01/07 Javascript
[05:49]2014DOTA2TI4正赛第二日综述 昔日冠军纷纷落马 VG LGD占尽先机
2014/07/20 DOTA
python连接mysql调用存储过程示例
2014/03/05 Python
Python利用正则表达式匹配并截取指定子串及去重的方法
2015/07/30 Python
Python编写一个闹钟功能
2017/07/11 Python
详解Django中CBV(Class Base Views)模型源码分析
2019/02/25 Python
OpenCV HSV颜色识别及HSV基本颜色分量范围
2019/03/22 Python
基于python实现学生信息管理系统
2019/11/22 Python
Canvas 文本填充线性渐变的使用详解
2020/06/22 HTML / CSS
美国最大的袜子制造商和零售商:Renfro Socks
2017/09/03 全球购物
随机分配座位,共50个学生,使学号相邻的同学座位不能相邻
2014/01/18 面试题
房地产管理毕业生自荐信
2013/11/04 职场文书
农村婚庆司仪主持词
2014/03/15 职场文书
给男朋友的道歉短信
2015/05/12 职场文书
个人售房合同协议书
2016/03/21 职场文书
Python使用sql语句对mysql数据库多条件模糊查询的思路详解
2021/04/12 Python
java设计模式--建造者模式详解
2021/07/21 Java/Android
Python可视化学习之seaborn调色盘
2022/02/24 Python