欢迎访问 水平网    今天是:2017年11月22日 注册 | 登录 | 订阅 | 收藏
>> 网页编程 >> JavaScript >> 用Javascript为IMG添加onclick事件
推荐文章
热点文章
专题
JQuery框架
Prototype.js
HTML5

用Javascript为IMG添加onclick事件

作者:goaler,  来源:goalercn.com,  阅读:2182,  发布时间:2014-06-03 【放入收藏夹
我们在一些文章发布系统中,后台使用的编辑器插入图片的时候并不会自动给图片加上链接,有时候图片太大了,会将窗口撑开,为了不影响美观,我们也许会将图片缩小,于是乎,就要将图片放大,有些编辑器非常复杂,更改起来不方便,那么我们可以直接在显示文章内容的页面使用Javascript给图片批量都加上onclick事件。。。

假设如下一段文章内容存放于如下一个DIV中:
以下是HTML代码: <div id="content">
<img src="1.gif" />
<img src="2.gif" />
<img src="3.gif" />
<img src="4.gif" />
<img src="5.gif" />
</div>
这样,可以使用如下JS:
以下是Javascript代码: <script type="text/javascript">
<!--
var obj_content = document.getElementById('content');
var objimg = obj_content.getElementsByTagName('img');
if(objimg){
for(var i=0; i < objimg.length ; i++){
//imgsrc = objimg[i].src;
objimg[i].title = '点击查看大图';
objimg[i].style.cursor = "pointer";
objimg[i].onclick = function() {window.open(this.src)};

//下面是自动调整图片大小的代码
if(objimg[i].width > 600){
objimg[i].style.width = '600px'
}
if(objimg[i].height > 500){
objimg[i].style.height = '500px'
}
}
}
//-->
</script>
以上代码在IE6、Firefox下测试通过。。。
TGAS:JavascriptIMGonclick事件
评论【共有0条评论】查看所有评论
称呼:(*)   邮箱:   QQ:   验证码: 看不清楚?点击刷新验证码