项目中发现一个问题,easyui 下面的 messager 下面的组件不能根据消息内容自适应宽高,正常情况下应该是内容超过弹框时可以自动出现滚动条的,但经过测试 1.4.1 1.4.2 是直接把内容截断了,试了几个其他版本 1.3.1、1.4.5、1.7.1 都没有这个问题,不能升级组件,只能修改 css 样式。
修改 easyui.css, 大概在 2248 行
.messager-body {
padding: 10px;
overflow: hidden;
}
为
.messager-body {
padding: 10px;
/**overflow: hidden;**/
}
修改前效果:
修改后效果:
相关代码:
<!doctype html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”Generator” content=”EditPlus®”>
<meta name=”Author” content=””>
<meta name=”Keywords” content=””>
<meta name=”Description” content=””>
<link id=”easyuiTheme” rel=”stylesheet” type=”text/css” href=”easyui1.4.1/themes/default/easyui.css?v=4.0″>
<link rel=”stylesheet” type=”text/css” href=”easyui1.4.5/themes/icon.css?v=4.0″>
<script type=”text/javascript” src=”easyui1.4.1/jquery.min.js?v=4.0″></script>
<script type=”text/javascript” src=”easyui1.4.1/jquery.easyui.min.js?v=4.0″></script>
<title>Document</title>
</head>
<body>
<p>
<a href=”javascript:void(0)” class=”easyui-linkbutton” onclick=”center()”>Center</a>
<a href=”javascript:void(0)” class=”easyui-linkbutton” onclick=”dialog()”>dialog</a>
</p>
<div id=”dlg” class=”easyui-dialog” style=”width:200px;height:100px;padding:10px;” closed=”true”>
org.springframework.jdbc.BadSqlGrammarException: PreparedStatementCallback; bad SQL grammar [/**mycat:schema=G_101_bi*/ select a.*,b.gna dsgna,b.daad dsad from dtip a left join dsrc b on a.dsgco = b.gco where 1=1 order by gco desc limit 0,20]; nested exception is com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException: Unknown column ‘b.gna’ in ‘field list’
</div>
<script>
var msg=”org.springframework.jdbc.BadSqlGrammarException: PreparedStatementCallback; bad SQL grammar [/**mycat:schema=G_101_bi*/ select a.*,b.gna dsgna,b.daad dsad from dtip a left join dsrc b on a.dsgco = b.gco where 1=1 order by gco desc limit 0,20]; nested exception is com.mysql.jdbc.exceptions.jdbc4.MySQLSyntaxErrorException: Unknown column ‘b.gna’ in ‘field list'”;
var temp = escape(msg);
function center(){
$.messager.show({
title:’My Title’,
msg:'<div style=”width:200px;word-wrap:break-word;”>’+unescape(temp)+”</div>”,
showType:’fade’,
width:250,
height:200,
timeout:0,
draggable:true,
style:{
right:”,
bottom:”
}
});
}
function dialog(){
$(‘#dlg’).dialog(‘open’);
}
</script>
</body>
</html>