<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>extjs</title>
<link rel="stylesheet" type="text/css" href="http://www.asgfw.com/ext-3.2.0/resources/css/ext-all.css" />
<script type="text/javascript" src="http://www.asgfw.com/ext-3.2.0/adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="http://www.asgfw.com/ext-3.2.0/ext-all.js"></script>
<script type="text/javascript">
Ext.onReady(function(){
  // 右侧内容区域
  var tabs = new Ext.TabPanel({
id:'Tab',   
region: 'center',
margins:'3 3 3 0', 
activeTab: 0,
defaults:{autoScroll:true},
enableTabScroll:true,
items:[{
title: 'Bogus Tab',
html: 'xx'
}]
  });
  
  // 左侧导航区域
  var nav = new Ext.Panel({
title: 'Navigation',
region: 'west',
split: true, 
width: 200,
collapsible: true,
margins:'3 0 3 3',
cmargins:'3 3 3 3',
layout: {
type: 'accordion',
animate: true
},
    items:[{
border:false,
title: 'Navigation',
html: "<a onclick=\"NewTab('s')\">添加新标签</a>"
}, {
border:false,
title: 'Settings',
html: '<p>Some settings in here.</p>'
}]
  });
  
  // 外部主体区域
  var win = new Ext.Window({
title: 'Layout Window',
closable:true,
maximizable:true,
width:document.documentElement.clientWidth-20,
height:document.documentElement.clientHeight-20,
border:true,
plain:true,
layout: 'border',
items: [nav, tabs]
  });  win.show(this);
  
  NewTab("http://www.asgfw.com/");
  function NewTab(url){
alert("新标签");  
tabs.add({
  title: 'New Tab ',
  iconCls: 'tabs',
  html: '点击左侧 添加新标签按钮<br>为什么不能执行NewTab()这个函数<br>如果将function放在ext的外面那么是找不到tabs的,求教Ext高手,我的QQ是550759049,拜谢中..<br>'+url,
  closable:true
}).show();
  }
  
})</script>
</head><body>
</body>
</html>
可以直接把代码下载来看看,出错的地方是点击“添加新标签”时,原因是没有找到NewTab函数,请问这怎么解决,我的qq是550759049,在线等答案。

解决方案 »

  1.   


        var tabs;
    Ext.onReady(function(){
      // 右侧内容区域
    tabs = new Ext.TabPanel({
        id:'Tab',                          
        region: 'center',
        margins:'3 3 3 0', 
        activeTab: 0,
        defaults:{autoScroll:true},
        enableTabScroll:true,
        items:[{
        title: 'Bogus Tab',
        html: 'xx'
        }]
      });
      
      // 左侧导航区域
      var nav = new Ext.Panel({
        title: 'Navigation',
        region: 'west',
        split: true, 
        width: 200,
        collapsible: true,
        margins:'3 0 3 3',
        cmargins:'3 3 3 3',
        layout: {
            type: 'accordion',
            animate: true
        },
        items:[{
            border:false,
            title: 'Navigation',
            html: "<a onclick=\"NewTab('s')\">添加新标签</a>"
        }, {
            border:false,
            title: 'Settings',
            html: '<p>Some settings in here.</p>'
        }]
      });
      
      // 外部主体区域
      var win = new Ext.Window({
        title: 'Layout Window',
        closable:true,
        maximizable:true,
        width:document.documentElement.clientWidth-20,
        height:document.documentElement.clientHeight-20,
        border:true,
        plain:true,
        layout: 'border',
        items: [nav, tabs]
      });  win.show(this);  
    })var NewTab = function(url) {
        alert("新标签");
        tabs.add({
            title: 'New Tab ',
            iconCls: 'tabs',
            html: '点击左侧 添加新标签按钮<br>为什么不能执行NewTab()这个函数<br>如果将function放在ext的外面那么是找不到tabs的,求教Ext高手,我的QQ是550759049,拜谢中..<br>' + url,
            closable: true
        }).show();
    }
      

  2.   

    <!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">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>extjs</title>
    <link rel="stylesheet" type="text/css" href="http://www.asgfw.com/ext-3.2.0/resources/css/ext-all.css" />
    <script type="text/javascript" src="http://www.asgfw.com/ext-3.2.0/adapter/ext/ext-base.js"></script>
    <script type="text/javascript" src="http://www.asgfw.com/ext-3.2.0/ext-all.js"></script>
    <script type="text/javascript">
    Ext.onReady(function(){
      // 右侧内容区域
      var tabs = new Ext.TabPanel({
        id:'Tab',                          
        region: 'center',
        margins:'3 3 3 0', 
        activeTab: 0,
        defaults:{autoScroll:true},
        enableTabScroll:true,
        items:[{
        title: 'Bogus Tab',
        html: 'xx'
        }]
      });
      
      // 左侧导航区域
      var nav = new Ext.Panel({
        title: 'Navigation',
        region: 'west',
        split: true, 
        width: 200,
        collapsible: true,
        margins:'3 0 3 3',
        cmargins:'3 3 3 3',
        layout: {
            type: 'accordion',
            animate: true
        },
        items:[{
            border:false,
            title: 'Navigation',
            html: "<a onclick=\"NewTab('s')\">添加新标签</a>" //这里调用的NewTab是全局域的NewTab
        }, {
            border:false,
            title: 'Settings',
            html: '<p>Some settings in here.</p>'
        }]
      });
      
      // 外部主体区域
      var win = new Ext.Window({
        title: 'Layout Window',
        closable:true,
        maximizable:true,
        width:document.documentElement.clientWidth-20,
        height:document.documentElement.clientHeight-20,
        border:true,
        plain:true,
        layout: 'border',
        items: [nav, tabs]
      });  win.show(this);
      
     //NewTab改成全局变量,仍然可以读局部的tabs变量。
      window['NewTab'] = function(url){
        alert("新标签");  
        tabs.add({
          title: 'New Tab ',
          iconCls: 'tabs',
          html: '点击左侧 添加新标签按钮<br>为什么不能执行NewTab()这个函数<br>如果将function放在ext的外面那么是找不到tabs的,求教Ext高手,我的QQ是550759049,拜谢中..<br>'+url,
          closable:true
        }).show();
      }
      NewTab("http://www.asgfw.com/");
    })</script>
    </head><body>
    </body>
    </html>