最近在解决Ext在浏览器中兼容性的问题,在网上找了好多方法,比如使用
use strict
还有就是添加特定的<Meta>和删除掉<!DOCTYPE html>这部分的内容等,但都不能解决下面图示所出现的问题,第一次发帖,还望各位知道的大神告诉下我,谢谢各位大神
<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/adsfw/taglibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3/1999/xhtml">
<head>
<title>房屋查询</title>
<%@ include file="/adswf/engine/public/meta_wf.jsp"%>
<script type="text/javascript" src="${ctx}/resources/js/easyui/easycore.js"></script>
<script src="${ctx}/bdcdj4/xxcx/js/bdcdycxGrid.js" type="text/javascript"></script>
<script src="${ctx}/adsfw/public/export/excel/clientexcel.js" type="text/javascript"></script>
<script src="${ctx}/bdcdj4/xxcx/js/FwForExcel.js" type="text/javascript"></script>
<script type="text/javascript">
document.οnkeydοwn=function(e){
// 兼容FF和IE和Opera
var theEvent = e || window.event;
var code = theEvent.keyCode || theEvent.which || theEvent.charCode;
if (code == 13) {
summaryGrid.store.load();
}
}
var cx_flag = {
cxFlag:'fwcx'//标识从哪个查询入口进来的,传递给xxcxGrid.js
};
Ext.onReady(function(){
//查询
var searchForm = new Ext.FormPanel({
region: 'north',
title: ' 房屋查询',
iconCls: 'icon-xxcx-fwcx',
labelAlign: 'right',
height: 160,
labelWidth: 70,
frame: true,
plain: true,
collapsible: true,
border: true,
margins: '1 1 2 1',
items: [{
layout: 'column',
items:[{
columnWidth: .37,
layout: 'form',
labelWidth: 100,
items: [{
xtype: 'textfield',
fieldLabel: '权利人姓名',
name: 'qlr',
anchor: '95%',
emptyText:'+,表示与或'
}]
},{
columnWidth: .37,
layout: 'form',
labelWidth: 100,
items: [{
xtype: 'textfield',
fieldLabel: '身份证',
name: 'zjh',
anchor: '95%'
}]
}]
},{
layout: 'column',
items:[{
columnWidth: .37,
layout: 'form',
labelWidth: 100,
items: [{
xtype: 'textfield',
fieldLabel: '不动产权证号',
name: 'bdcqzh',
anchor: '95%',
emptyText:'+,表示与或'
}]
},{
columnWidth: .37,
layout: 'form',
labelWidth: 100,
items: [{
xtype: 'textfield',
fieldLabel: '不动产单元号',
name: 'bdcdyh',
anchor: '95%'
}]
}]
},{
layout: 'column',
items:[{
columnWidth: .37,
layout: 'form',
labelWidth: 100,
items: [{
xtype: 'textfield',
fieldLabel: '业务号',
name: 'ywh',
anchor: '95%'
}]
},{
columnWidth: .37,
layout: 'form',
labelWidth: 100,
items: [{
xtype: 'textfield',
fieldLabel: '坐落',
name: 'zl',
anchor: '95%',
emptyText:'+,表示与或'
}]
}]
},{
layout: 'column',
items:[{
columnWidth: .37,
layout: 'form',
labelWidth: 100,
items: [{
xtype: 'datefield',
fieldLabel: '登记开始时间',
format: 'Y-m-d',
name: 'djkssj',
id:'kssj',
anchor: '95%'
}]
},{
columnWidth: .37,
layout: 'form',
labelWidth: 100,
items: [{
xtype: 'datefield',
fieldLabel: '至',
format: 'Y-m-d',
name: 'djjssj',
id:'jssj',
anchor: '95%',
listeners:{
'select': function(){
var kssj=Ext.getCmp('kssj').value;
var dt1 = new Date(kssj);//获取选择的时期对象
var jssj=Ext.getCmp('jssj').value;
var dt2 = new Date(jssj);//获取选择的时期对象
value1 = Date.parse(dt1); //Date.parse的处理很关键
value2 = Date.parse(dt2);
if(value1 > value2){
Ext.getCmp('jssj').setValue('');
Ext.Msg.alert('结果', '结束时间小于开始时间,请重新选择!');
}
}
}
}]
},
{
columnWidth: .24,
layout: 'hbox',
defaults:{margins:'0 5 0 0'},
items:[{
xtype: 'button',
text: ' 查询',
width: 80,
iconCls: 'icon-find',
handler: function(){
this.summaryGrid.store.load();
},
scope: this
},{
xtype: 'button',
text: '清空',
iconCls: 'icon-bdcdj-clear',
width: 80,
handler: function(){
this.searchForm.form.reset();
this.summaryGrid.store.load();
},
scope: this
}]
}]
}]
});
this.searchForm = searchForm;
var summaryGrid = new Ext.ux.grid.XxcxGrid({
id: 'DZB_SUMMARY_GRID',
region: 'center',
margins: '0 1 1 1',
url: this.ctx+'/bdcdj-xxcx!searchByfw.action',
keyField: 'id',
enableHandleTaskBtn: true,
isSingleSelect:true,//多选框
pageSize:15,
isShowPrite:true,//是否显示房屋打印
structure: [{
name: 'id',
header:'id',
hidden: true
},{
name: 'djlb',
header:'djlb',
hidden: true
},{
name: 'ywh',
header: '业务号',
width: 140
},{
name: 'qlr',
header: '权利人',
width: 150
},{
name: 'zjh',
header: '证件号',
width: 220
},{
name: 'zl',
header: '坐落',
width: 360,
forceFit: true
},{
name: 'bdcqzh',
header: '不动产权证号',
width: 260
},{
name: 'bdcdyh',
header: '不动产单元号',
width: 260
},{
name: 'djsj',
header: '登记时间',
width: 120
},{
name: 'latestZt',
header: '抵押、查封、异议、限制情况',
width: 240
}]
});
this.summaryGrid = summaryGrid;
var viewport = new Ext.Viewport({
layout: 'border',
items: [searchForm, summaryGrid]
});
var store = summaryGrid.store;
store.on('beforeload', function(){
store.baseParams = {
groupBy: store.groupField ? store.groupField : null,
qlr:searchForm.form.findField('qlr').getValue(),
zjh:searchForm.form.findField('zjh').getValue(),
bdcqzh:searchForm.form.findField('bdcqzh').getValue(),
bdcdyh:searchForm.form.findField('bdcdyh').getValue(),
djkssj:searchForm.form.findField('djkssj').getValue(),
djjssj:searchForm.form.findField('djjssj').getValue(),
ywh:searchForm.form.findField('ywh').getValue(),
zl:searchForm.form.findField('zl').getValue()
};
}, this);
});
</script>
</head>
<body>
</body>
</html>
如上图是运行的功能代码~
如上图是IE11和360浏览器中功能显示的画面
如上图是火狐、谷歌和QQ中正常显示的页面
更多推荐
Ext3在IE11和360浏览器中显示不兼容、排版混乱,但在火狐、谷歌和QQ中显示正常
发布评论