extjs的jsp標籤庫的簡單介紹

本文目錄一覽：

• 1、怎麼樣理解Jsp頁面裡面寫的Ext代碼，或者是怎麼把界面顯示出來的
• 2、ExtJS 中JS頁面如何調用另外一個XX.jsp頁面javascript中的方法?
• 3、extjs裡面怎麼嵌入JSP頁面
• 4、extjs如何在jsp中使用
• 5、我用extjs在面板上引用了一個jsp頁面，但是不能全部顯示，應該設置什麼屬性啊

怎麼樣理解Jsp頁面裡面寫的Ext代碼，或者是怎麼把界面顯示出來的

jsp頁面中是一部分頁面布局是通過extjs代碼來展示的。

比如：

var htmlPanel = new Ext.Panel( {

width : ‘100%’,

height : ‘100%’,

autoScroll : false,

frame : true,

html : ‘div id=”sna_html”/div’,//div頁面在這裡顯示

listeners : {

‘beforerender’ : function() {

Ext.Ajax( {

url : request.do’,//請求

params : {

id:id//整個是參數，沒有的不用寫

},

success : function(ret) {

document.getElementById(“sna_html”).innerHTML = ret;//動態的將頁面載入

},

waitmsg : “請求中…….”

});

}

}

});

以上代碼：只是動態的將jsp頁面載入到了div中。

ExtJS 中JS頁面如何調用另外一個XX.jsp頁面javascript中的方法?

ExtJS 中JS頁面是不可以跨jsp頁面去調用jsp頁面的js方法的。需要把js函數寫到extjs才可以調用。

DJSLoader=function(){

this.init=function(opt){};

this.JS=new Array();

this.loadJS=function(file,path){

path=path?path:”;

var script=document.getElementsByTagName(“script”);

var i,j;

for (i=0,j=script.length;ij;i++){

if (script[i].getAttribute(“src”) == (path+file)){

return;

}

}

var _script=document.createElement(“script”);

_script.type=”text/javascript”;

_script.src=”test.js”;

var st=new Object();

st.file=file;

st.path=path;

st.loaded=false;

this.JS.push(st);

_script.onload=function(obj){

obj.setJSStatus(file,true,path);

}.createDelegate(_script,[this]);

_script.onreadystatechange=function(obj){

if ( this.readyState==’loaded’ || this.readyState==’complete’ ) {

obj.setJSStatus(file,true,path);

}

}.createDelegate(_script,[this]);

document.getElementsByTagName(“head”)[0].appendChild(_script);

};

以上方法調用完成後，要調用的js文件已經載入到當前extjs頁面了，那麼就可以直接調用了。

extjs裡面怎麼嵌入JSP頁面

你說的是在ExtJS控制項裡面引入jsp頁面嗎，可以這麼做：

例如要在一個panel或者tabPanel的標籤頁里引入某個jsp頁面時，可以使用這些控制項的html標籤，

html : ‘iframe src= “jsp頁面的路徑” width=”100%” height=”100%” marginwidth=”0″ framespacing=”0″ marginheight=”0″ frameborder=”0″ /iframe

extjs如何在jsp中使用

首先將extjs文件夾複製到WebRoot目錄下，然後新建JSP

%@ page language=”java” contentType=”text/html; charset=UTF-8″

pageEncoding=”UTF-8″%

!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” ” “

html

head

meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″

link rel=”stylesheet” type=”text/css” href=”extjs/resources/css/ext-all.css”/

script type=”text/javascript” src=”extjs/ext-base.js”/script

script type=”text/javascript” src=”extjs/ext-all.js”/script

script type=”text/javascript” src=”extjs/ext-lang-zh_CN.js”/script

script type=”text/javascript” src=”jsp.index.js”/script

titleInsert title here/title

link rel=”stylesheet” type=”text/css” href=”css/db_browser.css”

/head

body

/body

/html

然後建相應的JS文件

Ext.onReady(function(){

Ext.Msg.alert(‘ExtJs’ ,’這是一個ExtJs的對話框。’);

});

或者把上面這段代碼放到JSP中也可以。

啟動伺服器，打開瀏覽器就可以看到效果了。

我用extjs在面板上引用了一個jsp頁面，但是不能全部顯示，應該設置什麼屬性啊

你用的是布局是什麼，最簡單的改為fit

大概是這樣

{

xtype:’panel’,

layout:’fit’

items:[

{

xtype:’component’,

html:’你的jsp’

}

]

}