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 相关文章推荐
JavaScript CSS修改学习第一章 查找位置
Feb 19 Javascript
javascript垃圾收集机制与内存泄漏详细解析
Nov 11 Javascript
表单序列化与jq中的serialize使用示例
Feb 21 Javascript
JavaScript检查某个function是否是原生代码的方法
Aug 20 Javascript
js完美实现@提到好友特效(兼容各大浏览器)
Mar 16 Javascript
简单总结JavaScript中的String字符串类型
May 26 Javascript
JS实现的驼峰式和连字符式转换功能分析
Dec 21 Javascript
浅谈React Event实现原理
Sep 20 Javascript
使用异步组件优化Vue应用程序的性能
Apr 28 Javascript
微信小程序开发摇一摇功能
Nov 22 Javascript
vue中keep-alive内置组件缓存的实例代码
Apr 16 Javascript
解决vue elementUI 使用el-select 时 change事件的触发问题
Nov 17 Vue.js
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中文字母数字验证码实现代码
2008/04/25 PHP
php中一个有意思的日期逻辑处理
2012/03/25 PHP
php中配置文件操作 如config.php文件的读取修改等操作
2012/07/07 PHP
PHP错误Allowed memory size of 67108864 bytes exhausted的3种解决办法
2014/07/28 PHP
一个经典实用的PHP图像处理类分享
2014/11/18 PHP
PHP连接access数据库
2015/03/27 PHP
为你总结一些php系统类函数
2015/10/21 PHP
PHP实现简单的模板引擎功能示例
2017/09/02 PHP
jQuery each()方法的使用方法
2010/03/18 Javascript
jQuery 学习第五课 Ajax 使用说明
2010/05/17 Javascript
js函数的引用, 关于内存的开销
2012/09/17 Javascript
JS中如何设置readOnly的值
2013/12/25 Javascript
jQuery动画效果animate和scrollTop结合使用实例
2014/04/02 Javascript
JQuery学习总结【二】
2016/12/01 Javascript
js实现类bootstrap模态框动画
2017/02/07 Javascript
JS常用正则表达式总结【经典】
2017/05/12 Javascript
详解vue2.0监听属性的使用心得及搭配计算属性的使用
2018/07/18 Javascript
jQuery实现菜单的显示和隐藏功能示例
2018/07/24 jQuery
vue通过指令(directives)实现点击空白处收起下拉框
2018/12/06 Javascript
微信小程序开发实现的IP地址查询功能示例
2019/03/28 Javascript
nodejs和react实现即时通讯简易聊天室功能
2019/08/21 NodeJs
你知道JavaScript Symbol类型怎么用吗
2020/01/08 Javascript
JS数据类型判断的几种常用方法
2020/07/07 Javascript
Python标准异常和异常处理详解
2015/02/02 Python
Python中type的构造函数参数含义说明
2015/06/21 Python
Python实现的质因式分解算法示例
2018/05/03 Python
Python读取excel指定列生成指定sql脚本的方法
2018/11/28 Python
记一次python 内存泄漏问题及解决过程
2018/11/29 Python
python+openCV调用摄像头拍摄和处理图片的实现
2019/08/06 Python
Python使用微信接入图灵机器人过程解析
2019/11/04 Python
Python写捕鱼达人的游戏实现
2020/03/31 Python
华美博弈C/VC工程师笔试试题
2012/07/16 面试题
代领毕业证委托书
2014/08/02 职场文书
组工干部演讲稿
2014/09/02 职场文书
2014年收银工作总结
2014/11/13 职场文书
Requests什么的通通爬不了的Python超强反爬虫方案!
2021/05/20 Python