extjs radiogroup checkbox 浏览器间兼容性

最新推荐文章于 2024-12-02 13:52:57 发布

原创最新推荐文章于 2024-12-02 13:52:57 发布 · 599 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#extjs #radiogroup #checkbox #label与box

EXTJS 专栏收录该内容

4 篇文章

订阅专栏

博客内容探讨了ExtJS中Radiogroup和Checkbox在不同浏览器（如IE, Firefox, Chrome）中，Label与Box之间显示间距不一致的问题。作者通过引入XHTML 1.0 Transitional DTD来尝试解决这一跨浏览器的兼容性差异。" 81121847,942556,Roslyn 语法树详解：节点类型与含义,"['C#开发', '编译原理', '源码分析', 'Roslyn API']

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

radiogroup checkbox在ie,firefox,chrome中label与box之间显示空间大小不一致，

在代码中加入：

<!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">

radiobox及checkbox代码：

var auditPanel = new Ext.Panel({
			layout:'form',
			items:[{
				autoWidth:true,
		        autoHeight:true,
		        layout:'column',
				items:[{
    				columnWidth:.5,
    				layout:'form',
    				defaults:{width:200},
    				items:[{
    					xtype:'radiogroup',
	    				fieldLabel: '审核',
	    				<span style="color:#ff0000;">labelStyle:'white-space:nowrap;',
	    				labelAlign:'right',</span>
	    				width:170,
						items:[{
							boxLabel: '审核通过',
							name: 'audition',
							id:'audition',
							inputValue: 2,
							checked:true,
							listeners:{
								check:function(r,checked){
									if(checked){
	 									Ext.getCmp('release').setDisabled(false);
									}
									else{
	 									Ext.getCmp('release').setDisabled(true);
	 									Ext.getCmp('release').setValue(false);
									}
								}
							}
						},{
							boxLabel: '审核未通过',
							name:'audition',
							inputValue: 3,
							checked:false
						}]
    				}]
    			},{
    				columnWidth:.5,
    				layout:'form',
    				labelWidth:90,
    				labelAlign:'right',
    				items:[{
    					xtype:'checkbox',
    					id:'release',
    					name:'release',
	    				fieldLabel: '审核通过并发布',
	    				labelStyle:'white-space:nowrap;',
	    				width:60
    				}]
    			}]
			},{
                xtype:'textarea',
               	fieldLabel:'审核意见',
               	labelAlign:'right',
                id:'auditReason',
                name:'auditReason',
                anchor:'70%',
                maxLength:512,
                msgTarget:'side'
			}]
		});

样式：