JSP 頁面通常嵌入 JS 代碼,且 JS、JSP之間需要相互使用一些變量的值,但JSP代碼在服務器運行、JS代碼在客戶端瀏覽器運行,所以涉及到JS和JSP值傳遞問題。其交互方式如下:
1.JS使用JSP中的變量
1
2
3
|
<%
String test =
"I am testing !"
; // JSP片段中定義變量
%>
|
1
2
3
4
|
<SCRIPT LANGUAGE =
"JavaScript"
>
var tmp =
"<%=test %>"
; // 通過
"<%=javaCode %>"
引用jsp中的變量、方法等,注意:一定要加雙引號
alert(tmp);
</SCRIPT >
|
2.JSP使用JS中的變量
由於JSP代碼在服務器運行,無法直接使用客戶端的JS代碼中的變量。需先把客戶端的變量提交到服務器,服務器再接收該變量。
案例如下:將a.jsp頁面JS代碼段的變量提交到服務器,JSP片段再獲取該變量。
-- 以下是JSP中HTML代碼,用於將JS中變量存儲到隱藏控件中
1
2
3
4
|
<!
-- 在form中設置隱藏控件,用來存儲JS中的值 -->
<form
name
=
"frmApp"
action
=
"a.jsp"
id=
"frmAppId"
mothed=
"post"
/>
<input id=
"test"
type=
"hidden"
name
=
"test"
>
</form>
|
-- 以下是JSP中JS代碼,通過表單將提交本頁面(隱藏控件將被提交到服務器)
1
2
3
4
5
6
7
8
9
10
11
|
<script language=
"javascript"
>
function
setItemValue(){
var tmp =
"testing"
;
document.getElementById(
"test"
).value = tmp; // 將JS變量值存儲到隱藏控件中
}
function
submit(){
var frm = document.getElementById(
"frmAppId"
); // 獲取表單
frm.submit(); // 對表單進行提交
}
</script>
|
-- 以下是a.jsp中在表單進行提交后,對變量進行接收的代碼
1
2
3
|
<%
String test = request.getParameter(
"test"
); // test為隱藏控件名
%>
|
注意:通過提交form形式使得JSP能夠使用JS變量會刷新本頁面,在頁面不需要保持狀態情況下可以考慮使用。否則,可以通過Ajax進行異步通信。