javascript 外部文件获取后台变量

Java Web中，js外部文件如何获取后台的变量呢？

项目使用spring MVC框架，

IDE:eclipse；

使用maven构建

控制器（OsTypeController.Java）如下：

Java代码  

1. package com.ct.web.controller;  
2.   
3. import java.util.Date;  
4. import java.util.List;  
5.   
6. import org.springframework.beans.factory.annotation.Autowired;  
7. import org.springframework.stereotype.Controller;  
8. import org.springframework.ui.Model;  
9. import org.springframework.web.bind.annotation.RequestMapping;  
10. import org.springframework.web.bind.annotation.SessionAttributes;  
11.   
12. import com.ct.dao.OsTypeDao;  
13. import com.ct.entity.OsType;  
14. import com.time.util.TimeHWUtil;  
15.   
16. @Controller  
17. @RequestMapping("/osType")  
18. @SessionAttributes("practiceWay")  
19. public class OsTypeController {  
20.   
21.     private OsTypeDao osTypeDao;  
22.     private String redirectViewAll="redirect:/osType/viewAll";  
23.       
24.       
25.     @RequestMapping(value = "/add")  
26.     public String addInputOsType(String practiceWay,Model model){  
27.         model.addAttribute("practiceWay", practiceWay);  
28.         System.out.println("practiceWay:"+practiceWay);  
29.         return "osType/addOSType";  
30.     }  
31.       
32.     /******************************************************************/  
33.     public OsTypeDao getOsTypeDao() {  
34.         return osTypeDao;  
35.     }  
36.     @Autowired  
37.     public void setOsTypeDao(OsTypeDao osTypeDao) {  
38.         this.osTypeDao = osTypeDao;  
39.     }  
40.       
41.       
42. }  

 控制器方法addInputOsType 对应的页面(addOSType.jsp)如下：

Html代码  

1. <?xml version="1.0" encoding="UTF-8" ?>  
2. <%@ page language="java" contentType="text/html; charset=UTF-8"  
3.     pageEncoding="UTF-8"%>  
4. <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>  
5. <%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>  
6. <%  
7.     String path = request.getContextPath();  
8.     String basePath = request.getScheme() + "://"  
9.             + request.getServerName() + ":" + request.getServerPort()  
10.             + path + "/";  
11. %>  
12. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
13. <html xmlns="http://www.w3.org/1999/xhtml">  
14. <head>  
15. <base href="<%=basePath%>">  
16.     <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />  
17.     <title>Insert title here</title> <script type="text/javascript"  
18.         src="<%=path%>/static/js/Module.js"></script>  
19.     <script type="text/javascript" src="<%=path%>/static/js/common_util.js"></script>  
20.     <script type="text/javascript" src="<%=path%>/static/js/test.js"></script>  
21.       
22. </head>  
23. <body>  
24.     <center>  
25.     <h1><span id="titleSpan">add </span> </h1>  
26.     <input type="hidden" value="${sessionScope.practiceWay}" name="hidpracticeWay" />  
27.     <a href="javascript:history.go(-1)" >return </a>&nbsp;|&nbsp;  
28.     <a href="index.jsp" >index</a>&nbsp;|&nbsp;<a href="osType/viewAll">view all</a>  
29.         <form action="osType/save" name="inputform" >  
30.             <table>  
31.                 <tr>  
32.                     <td>os name:</td>  
33.                     <td><input type="text" name="name" /></td>  
34.                 </tr>  
35.                 <tr>  
36.                     <td colspan="2" ><input type="submit"  
37.                         value="&nbsp;&nbsp;o&nbsp;k&nbsp;&nbsp;" id="submit_btn" /></td>  
38.                 </tr>  
39.             </table>  
40.             <div id="hidden_div"></div>  
41.         </form>  
42.     </center>  
43. </body>  
44. </html>  

 其中外部js文件（test.js）如下：

Js代码  

1. alert("111:${sessionScope.practiceWay}");  
2. window.onload =function a()  
3. {  
4.     alert("method:a");  
5.     alert("444:${sessionScope.practiceWay}");  
6.     alert("hid:"+document.getElementsByName("hidpracticeWay")[0].value);  
7. };  

 在浏览器中输入http://localhost:8088/demo_channel_terminal/osType/add?practiceWay=random

运行结果：

 

对应的是外部js文件（test.js）的执行结果。

所以我们可以得出结论：

在外部js文件获取后台变量的方式就是通过获取页面隐藏域的值。

具体步骤：

（1）把后台变量设置到页面隐藏域中，例如

Java代码  

1. <input type="hidden" value="${sessionScope.practiceWay}" name="hidpracticeWay" />  

 （2）在外部js文件中获取隐藏域的值，例如

Java代码  

1. alert("hid:"+document.getElementsByName("hidpracticeWay")[0].value);  

那么在jsp页面中的js代码中如何获取后台变量的值呢？

请参阅我的下一篇日志