JavaScript控制JSP中的Java代碼

原創

2020-02-20 15:38

總所周知，JSP中的java代碼是在服務器端執行的程序，JavaScript代碼在瀏覽器端執行，因此同一個頁面的先執行Java代碼，然後執行JavaScript代碼。JavaScript是無法控制Java代碼。

但是有一個需求要根據JavaScript的選擇來決定Java代碼執不執行。這個時候就要用到Ajax，需要2張JSP頁面。當Ajax觸發時候，另外一個JSP頁面被加載，這個JSP頁面中的Java被執行，以實現JavaScript控制Java代碼。只能控制其他頁面的Java代碼，不能控制，本頁面的Java代碼。

1、在Oracle中建立表。

2、創建被調用的JSP頁面update.jsp。

<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ page import="java.sql.*"%>  <!--   添加java的sql包 -->
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>加載頁面</title>
</head>
<body>

<%Class.forName("oracle.jdbc.driver.OracleDriver").newInstance(); //加載Oracle數據庫的驅動   
  String url="jdbc:oracle:thin:@localhost:1521:orcl";       //添加Oracle的連接地址，localhost即默認本機地址
  String user="student";  //數據庫的帳號
  String password="student";//數據庫的密碼
  Connection conn= DriverManager.getConnection(url,user,password);   //將url，user和password實現數據庫的連接 
  Statement stmt=conn.createStatement(ResultSet.TYPE_SCROLL_SENSITIVE,ResultSet.CONCUR_UPDATABLE);//實例化Statement對象    
  String sql="select * from sparametertbl t where t.PARAMETER='autoChecking' "; //查詢語句   
  String sql2="update  sparametertbl t set t.value='0'   where t.parameter='autoChecking'";//修改語句1
  String sql3="update  sparametertbl t set t.value='1'   where t.parameter='autoChecking'";//修改語句2
  ResultSet rs=stmt.executeQuery(sql);  //執行查詢操作
  String flag="";
     while(rs.next()) { //利用循環獲取結果集的數據
       flag=rs.getString(2);
                      }   
  String show="";
     if(flag.equals("1")){//當結果是1的時候置換成0
	   stmt.executeUpdate(sql2);//執行修改操作
	   show="關閉";
	   flag="0";
     }else{           //當結果是0的時候置換成1
	   stmt.executeUpdate(sql3);//執行修改操作
	   show="開啓";
	   flag="1";   
     }
  rs.close();   //關閉rs
  stmt.close();  //關閉操作
  conn.close(); //關閉連接   
%>  
當前自動檢測的狀態是：<%=show%> <%=flag%> 
</body>
</html>

3、創建含Ajax的調用頁面，index.jsp

<%@ page language="java" contentType="text/html; charset=utf-8"
	pageEncoding="utf-8"%>
<%@ page import="java.sql.*"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>自動檢測更改頁面</title>
<script type="text/javascript" src="js/jquery.js" ></script>
</head>
<body>

<%Class.forName("oracle.jdbc.driver.OracleDriver").newInstance();    
String url="jdbc:oracle:thin:@localhost:1521:orcl"; 
String user="student"; 
String password="student"; 
Connection conn= DriverManager.getConnection(url,user,password);    
Statement stmt=conn.createStatement(ResultSet.TYPE_SCROLL_SENSITIVE,ResultSet.CONCUR_UPDATABLE);    
String sql="select * from sparametertbl t where t.PARAMETER='autoChecking' ";    
ResultSet rs=stmt.executeQuery(sql);  
String flag="";
while(rs.next()) { 
flag=rs.getString(2);
}   
String show="";
if(flag.equals("1")){
	show="開啓";
}else{
	show="關閉";
}
rs.close();    
stmt.close();    
conn.close();    
%>  
當前自動檢測的狀態是：<%=show%> flag: <%=flag%> 


<a href="#" οnclick="docheck()"><button type="button">改變狀態</button></a>
  <script type = "text/javascript" language = "javascript">  
   function docheck()  
   {   
	   if(confirm("確定要修改狀態嗎？"))   
       {   
		  jQuery.ajax({
			    cache: false,//清除緩存操作
				url : "update.jsp"	,//URL指向要調用的頁面
				dataType:'jsp'//類型是JSP
					});
		  location.reload();//刷新頁面操作
		}  else{
		}
   }  
   </script>
   
</body>
</html>

4、最終效果：剛開始爲關閉狀態。點擊按鈕，提示是否改變狀態，點擊是。這時候Ajax觸發另外一個頁面的Java代碼，SQL的update被執行。自動刷新頁面，這時候顯示爲開啓狀態。當再次點擊時，狀態會再次發生改變。