代码如下:
[code="java"]
function BrowerArticle(ArticleID, ArticleTitle) {
//判断 如果存在 就直接跳转
var temp_Tab_Center = Ext.getCmp('id_Tab_Center');
//如果存在 就跳转到该页
for (var i = 0; i < temp_Tab_Center.items.length; i++) {
if (temp_Tab_Center.items.items[i].id == 'Article_' + ArticleID) {
temp_Tab_Center.activate(temp_Tab_Center.items.items[i]);
return;
}
}
//----------------------------页面内容 begin--------------------------------
//-->帖子题目
var ArticleTitleLabel = new Ext.form.Label({
id: 'ArticleTitleLabel_' + ArticleID
, name: 'ArticleTitleLabel_' + ArticleID
, text: ArticleTitle
, style : 'font-size:x-large;color:Blue'
});
//-->帖子内容
//数据获取地址
var strGridUrl = 'json/Forum/Article.aspx?Param=BrowerArticle&ArticleID=' + ArticleID;
//数据集格式
var fields = [
{name:'RevertID'},
{name:'ArticleID'},
{name:'dtPublish'},
{name:'UserId'},
{name:'UserName'},
{name:'RevertContent'},
{name:'IntSupport'},
{name:'IntAgainst' }
];
//数据集内容
var store = new Ext.data.Store
({
proxy: new Ext.data.HttpProxy({ url: strGridUrl }),
reader: new Ext.data.JsonReader({ totalProperty: 'totalProperty', root: 'root', fields: fields })
});
store.load({ params: { start: 0, limit: 40} });
//DataView
var tpl = new Ext.XTemplate(
''
, '
' , '{UserName} 发表于: {dtPublish}' , ' |
' , '{RevertContent}' , ' |
//-->整体Panel
var BrowerArticlePanel = new Ext.Panel({
title: ArticleTitle.substring(0,4)
,tabTip : ArticleTitle
, id: 'Article_' + ArticleID
, frame: true
, autoWidth: false
, autoheight: false
, autoScroll: true
, closable: true
, layout: 'column'
, items: [{
columnWidth:1,
style: 'text-align:center',
autoScroll : false,
items:[ArticleTitleLabel]
},
{
columnWidth:1,
autoScroll : false,
autoWidth:false,
autoHeight : false,
items:[BrowerArticle_DataView],
bbar : My_PTbar
},
{
columnWidth:1,
layout:'form',
autoScroll : false,
items:[ReplayContent],
buttons:[CancleButton,OKButton]
}
]
});
//如果没有 创建该页 并跳转到该页
temp_Tab_Center.add(BrowerArticlePanel);
temp_Tab_Center.activate(BrowerArticlePanel);
}
[/code]
实现的效果是一个帖子浏览页面 这个页面最终会放到主页面temp_Tab_Center中
最后上面是一个标题 中间是dataview显示帖子内容 dataview下面是pageingToolBar用作分页 最下面是一个跟帖的内容
现在碰到的问题是 我帖子里面如果有图片的话 会出现横向的滚动条 虽然图片宽度没有超过页面的宽度 请问大家这个是为什么啊?
结果图如下:
[img]http://dl.iteye.com/upload/attachment/155963/37aa5883-a0b2-3e40-a0c8-d0235a38cb5a.gif[/img]
[b]问题补充:[/b]
lovewhzlq:
autoScroll: true 这里改为false看看
这样的话 上下滚动条 就不显示了 并且 当图片超大的时候 横向滚动条还是需要显示的
jim.jin:
那有什么 解决方法么?
[b]问题补充:[/b]
我将, layout: 'column' 就该为 border:‘column’ 错误不再出现了 排版正常了 谢谢各位 虽然没有正确答案 为了谢谢jim.jin 的热心 我就放分了
是因为IE把纵向滚动条本身的宽度算在正个宽度里面,当纵向滚动条出来时就有这问题。
//-->整体Panel
var BrowerArticlePanel = new Ext.Panel({
title: ArticleTitle.substring(0,4)
,tabTip : ArticleTitle
, id: 'Article_' + ArticleID
, frame: true
, autoWidth: false
, autoheight: false
, [color=red]autoScroll: true [/color]这里改为false看看