初学EXT有些地方不是很明确特抛出我遇到的一个问题

问题描述:我用Ext.getDom("dddd").innerHTML想将id为dddd的元素放到title为“第二个条”的容器里面去,但是不能成功代码如下。

<html>
<head>


<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<script type="text/javascript" src="adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="resources/js/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="resources/css/common.css" />


<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>

<body>
<script type="text/javascript">
var tabPanel=new Ext.TabPanel({
id:"tabPanel",
region:'center',
deferredRender:false,
activeTab:0,
iconCls: 'tabs',
items:[{
contentEl:'center',
title: '主页',
autoScroll:true
}]
});



new Ext.Viewport({

layout:"border",
items:[{region:"north",height:70,html:"<h1 align='center'>我的样式</h1>"},

{title:"菜单",
id:'menu',
region:"west",
width:200,
collapsible:true,
split:true,
layout:'accordion',
items:[{title:'第一个条',html:"<input type='button' value='点击这里弹出窗体' onclick='showwin();' id='aa'>", autoScroll:true, iconCls:'user', border:false},{title:'第二个条',html:Ext.getDom("dddd").innerHTML, autoScroll:true, iconCls:'unit', border:false}]
},
{xtype:"tabpanel",region:"center",items:[{title:"面板1",html:'面板一里面的内容'},{title:"面板2",html:'面板2的内容'}]
}]
});
function showalert(){
Ext.MessageBox.alert('提示', '是个什么样式的弹出框呢?');
}
function showwin(){
var win=new Ext.Window({title:'一个窗体',width:200,height:200,html:'<h1>测试信息</h1>'});
win.show();
}
function showtest(){
Ext.MessageBox.alert('提示', Ext.getDom("dddd").innerHTML);
}
</script>
<div id='aaaa'><input type='button' value='点击这里弹出窗体' onclick='showwin();' id='aa'></div>
<div id='bbbb'><input type='button' value='点击这里弹出警告框' onclick='showalert();' id='bb'></div>
<div id='xxxx'><input type='button' value='点击这里弹出测试信息对话框' onclick='showtest();'></div>
<div id="dddd">在div里面的测试信息</div>
<input type="hidden" value="测试消息" id="cccc">
</body>
</html>

<html>
<head>


<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<script type="text/javascript" src="adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="resources/js/ext-all.js"></script>
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
<link rel="stylesheet" type="text/css" href="resources/css/common.css" />


<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
</head>

<body>
<script type="text/javascript">
var tabPanel=new Ext.TabPanel({
id:"tabPanel",
region:'center',
deferredRender:false,
activeTab:0,
iconCls: 'tabs',
items:[{
contentEl:'center',
title: '主页',
autoScroll:true
}]
});



new Ext.Viewport({

layout:"border",
items:[{region:"north",height:70,html:"<h1 align='center'>我的样式</h1>"},

{title:"菜单",
id:'menu',
region:"west",
width:200,
collapsible:true,
split:true,
layout:'accordion',
items:[{title:'第一个条',html:"<input type='button' value='点击这里弹出窗体' onclick='showwin();' id='aa'>", autoScroll:true, iconCls:'user', border:false},{title:'第二个条',html:Ext.getDom("dddd").innerHTML, autoScroll:true, iconCls:'unit', border:false}]
},
{xtype:"tabpanel",region:"center",items:[{title:"面板1",html:'面板一里面的内容'},{title:"面板2",html:'面板2的内容'}]
}]
});
function showalert(){
Ext.MessageBox.alert('提示', '是个什么样式的弹出框呢?');
}
function showwin(){
var win=new Ext.Window({title:'一个窗体',width:200,height:200,html:'<h1>测试信息</h1>'});
win.show();
}
function showtest(){
Ext.MessageBox.alert('提示', Ext.getDom("dddd").innerHTML);
}
</script>
<div id='aaaa'><input type='button' value='点击这里弹出窗体' onclick='showwin();' id='aa'></div>
<div id='bbbb'><input type='button' value='点击这里弹出警告框' onclick='showalert();' id='bb'></div>
<div id='xxxx'><input type='button' value='点击这里弹出测试信息对话框' onclick='showtest();'></div>
<div id="dddd">在div里面的测试信息</div>
<input type="hidden" value="测试消息" id="cccc">
</body>
</html>



起初我认为是Ext.getDom("dddd").innerHTML这个方法用的不对,特意将这个方法做了一个测试代码如下Java代码


<input type='button' value='点击这里弹出测试信息对话框' onclick='showtest();'>
function showtest(){
Ext.MessageBox.alert('提示', Ext.getDom("dddd").innerHTML);
}

<input type='button' value='点击这里弹出测试信息对话框' onclick='showtest();'>
function showtest(){
Ext.MessageBox.alert('提示', Ext.getDom("dddd").innerHTML);
}


发觉这样调用是对的,那我为什么不能把dddd放到title为“第二个条”的容器里面去呢?谢谢
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值