bug:在label中包含img,在IE中点击图片的时候,radio没有被选中,别的浏览器可以

bug:在label中包含img,在IE中点击图片的时候,按钮没有被选中,别的浏览器可以

代码如下:

  

1 <td class="left">
2                         <input type="radio" name="sex" id="boy"/>
3                         <label for="boy" disabled=""><img src="images/boy.jpg"/>男</label>
4                         <input type="radio" name="sex" id="girl"/>
5                         <label for="girl" disabled=""><img src="images/girl.jpg"/>女</label>
6                     </td>

三种解决方式:

  第一种html:

  在img中添加一个disabled=""就可以解决问题

  

<label for="girl"><img src="images/girl.jpg" disabled=""/>女</label>

  第二种css:

在图片上覆盖一个容器,容器本身透明显示

<input type="radio" name="radio" id="a" /><label for="a"><img src="xxx.jpg" /><span></span></label>

将其中SPAN的属性设定有底色并且透明,SPAN覆盖到IMG上,并保持和图片同样的尺寸。

display:block;
width:100px;
height:100px;
background:url(xxx.png) no-repeat 0 0;
position:absolute;
left:0;
top:0;

 第三种js:

window.onload = function(){
if(document.all && navigator.appVersion.indexOf("MSIE")>-1 && navigator.appVersion.indexOf("Windows")>-1)
{
var a = document.getElementsByTagName("label");
for(var i=0,j=a.length;i<j;i++){
if(a[i].hasChildNodes && a[i].childNodes.item(0).tagName == "IMG")
{
a[i].childNodes.item(0).forid = a[i].htmlFor;
a[i].childNodes.item(0).onclick = function(){
var e = document.getElementById(this.forid);
switch(e.type){
case "radio": e.checked|=1;break;
case "checkbox": e.checked=!e.checked;break;
case "text": case "password": case "textarea": e.focus(); break;
} } } } } }

显然第一种方式更为简单,至于为什么,等我调查一下…………

 

bug:在label中包含img,在IE中点击图片的时候,radio没有被选中,别的浏览器可以,布布扣,bubuko.com

时间: 2024-10-09 00:56:10

bug:在label中包含img,在IE中点击图片的时候,radio没有被选中,别的浏览器可以的相关文章

关于kindeditor中点击图片后,滚动条往上顶的bug

比如现在我插入两张图片, 无论我点击哪张图片,里边的滚动条都会往上顶. 本来以为往上会有解决方法,一查结果没有:然后想着去官网查查,然而什么都没有,想到官网提交这个bug,结果没地方提交. 怎么解决,如果单是解决这个bug,去研究源码,我觉的是吃力不讨好的. 然后我就直接从 click.mousedown 这两个事件找起,找它们获得高度的地方,然后 感觉是的话就console.log下,看是不是.然后就找到了. 在这个函数里 pos : function() { var self = this,

如何在App中实现IM功能之五快速实现图片接收和发送——箭扣科技Arrownock

如何在App中实现IM功能 之五 快速实现图片接收和发送 社交App中,用户聊天发送或接收图片,是一个非常常见的场景,这里给大家介绍如何利用Arrownock的anSocial的Photo API与anIM结合,来实现发送和接收图片. 发送端详情 当发送方选择好图片点击发送时,为了不影响用户聊天过程中的体验,我们一般会将消息先插入到sqlite数据库中,刷新界面,给这条消息加上Loading动画,表示发送中.而这背后的操作为了能够节省流量的消耗,开发时因为图片往往比较大,所以并不是直接将图片的二

笔记01 登录、常用配置参数、Action访问Servlet API 和设置Action中对象的值、命名空间和乱码处理、Action中包含多个方法如何调用

Struts2登录 1. 需要注意:Struts2需要运行在JRE1.5及以上版本 2. 在web.xml配置文件中,配置StrutsPrepareAndExecuteFilter或FilterDispatcher 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 <filter>     <filter-name>struts2</filter-name>     <filter-class>org.apache.struts2.di

使用innerHTML获取HTML代码时,HTML标记属性的双引号好多都消失不见了,原来是属性值中包含空格才会保留双引号

最近搞的一个项目中所使用的方式比较奇怪,用Label显示HTML内容,然后不断地使用JS把Label的innerHTML复制到TextBox中. 但是,昨天发现了一个问题,获取元素值的时候,有时候正常,有时候不正常,然后进入了漫长的DEBUG.. 调试过程中,监测Label和TextBox的值,发现获取到Label的值是未被改变的,控件加载的时候是怎样就怎样,在页面中是以SPAN元素显示,在查看网页源代码的时候可以看到被修改了,但是在后台无论怎么获取都是页面加载时赋予的未经修改之前的值. 而Te

应用键横竖屏切换;label中显示图片;不同类型设备适配的代码;UIWebView字体大小、字体颜色、背景色的设置;

最近总结的工作中遇到的小问题在这里共享 ,希望对大家能有帮助 1.横屏的一个应用在修改个人资料过程从相册取图片或者拍照的过程中,横纵屏切换引起再次进入程序时应用变纵屏的bug --------------主页面控制器中点击进入个人资料页面的地方:---------------------- - (void)changepersonIcon{ UIActionSheet*actionSheet = [[UIActionSheetalloc] initWithTitle:@"选择封面图片"

bug生命周期中的各种状态

所有软件开发过程的目的都是为客户(软件产品的终端用户)提供一个解决问题的方案(软件产品),以帮助客户更加高效地工作或生活(从时间和费用上来讲).一个成功的软件开发过程就是为客户提供了所有他所要求的需求. 一个没有软件测试的软件开发过程是不完善的.软件测试是为了寻找并修复软件中的bug/错误,它可以帮助提高软件的质量,以保证用户可以正常使用软件产品. 什么是一个bug/错误? 软件中的bug或者错误就是所有会影响软件整体或者部分功能的正常运行的软件行为. 怎样找到bug/错误? 我们主要依靠运行测

接口中包含抽象类demo

package jiechoudemo; /* * 接口中包含抽象类 */ public class jiechoudemo { public static void main(String[] args) { windows.door wd = new zhuozi().new yizi(); wd.close(); } } //写一个接口 interface windows{ public abstract void open(); //抽象类 abstract class door{ pu

在 PHP 网页中包含文件 &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;

如果多个文件中有重复的代码,则可以将这部分代码写到一个文件中去,然后在需要的地方把这个文件包含进来即可.注意在这个文件中,只需要这些重复的代码,而不需要其它的格式或者什么的,文件名可以随便起,后缀可要可不要. 通过使用包含文件,您可以在自己的网站中的多个网页上轻松包含相同的内容.所谓包含文件是指当网页在浏览器中呈现时动态地包含在网页中的文件. 包含文件可以简化站点的管理工作.例如,您可以创建网站中多个网页上所要包含的网页横幅.网站信息块或菜单之类的内容.这样,当需要更改这些内容时,只需在单个文件

如何去除AJAX收到数据中包含的html页面数据

问题: 如下代码所示,我用AJAX收到来自url: 'kzkj_check.jsp',返回的数据msg,总是包含页面的html数据,可是我只想要我返回的数据“false”, $.ajax({ url: 'kzkj_check.jsp', async:false, data: 'un='+ $('#userName').val() +'&pw=' + $('#passWord').val(), type: "get", success: function(msg){ if(msg