资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
JavaScript教程
>>>
JS实现的radio图片选择按钮效果
用JS实现的radio图片选择按钮效果。注意：input后面的空格。
用到的图片：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>用JS实现的radio图片选择按钮效果-管理资源吧</title> <style> .lanrentuku img{border:1px solid #008800;} </style> </head> <body> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3E%20%0D%0Afunction%20myFun(sId)%20%7B%20%0D%0Avar%20oImg%20%3D%20document.getElementsByTagName('img')%3B%20%0D%0A%0D%0Afor%20(var%20i%20%3D%200%3B%20i%20%3C%20oImg.length%3B%20i%2B%2B)%20%7B%20%0D%0Aif%20(oImg%5Bi%5D.id%20%3D%3D%20sId)%20%7B%20%0D%0AoImg%5Bi%5D.previousSibling.previousSibling.checked%20%3D%20true%3B%20%0D%0AoImg%5Bi%5D.style.border%20%3D%20'1px%20solid%20%23FF6600'%3B%20%0D%0A%7D%20else%20%7B%20%0D%0AoImg%5Bi%5D.style.border%20%3D%20'1px%20solid%20%23008800'%3B%20%0D%0A%0D%0A%7D%20%0D%0A%7D%20%0D%0A%7D%20%0D%0A%3C%2Fscript%3E"> <div class="lanrentuku"> <input type="radio" value= "lanrentuku" id= "111" name="aaa" style="display:none"> <img id="aa" src="http://files.glzy8.com/upload/2010-1/20100119030617615.gif " _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2F2010-1%2F20100119030617615.gif%20" onclick="myFun(this.id)"> <input type="radio" value= "lanrentuku" id= "222" name="aaa" style="display:none"> <img id="bb" src="http://files.glzy8.com/upload/2010-1/20100119030617308.gif" _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2F2010-1%2F20100119030617308.gif" onclick="myFun(this.id)"> <input type="radio" value= "lanrentuku" id= "333" name="aaa" style="display:none"> <img id="cc" src="http://files.glzy8.com/upload/2010-1/20100119030617561.gif" _ewebeditor_ta_src="http%3A%2F%2Ffiles.glzy8.com%2Fupload%2F2010-1%2F20100119030617561.gif" onclick="myFun(this.id)"> </div> <p>用JS实现的radio图片选择按钮效果。</p> <p>注意：input后面的空格。</p> <p>查找更多代码，请访问：<a href="http://www.glzy8.com/" _ewebeditor_ta_href="http%3A%2F%2Fwww.glzy8.com%2F" target="_blank">管理资源吧</a></p> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程
