javascript 外部文件获取后台变量

最新推荐文章于 2023-08-17 21:45:00 发布

最新推荐文章于 2023-08-17 21:45:00 发布 · 474 阅读

文章标签：

#外部js文件 #js外部文件 #js文件 #获取变量 #获取后台变量

java 同时被 2 个专栏收录

315 篇文章

订阅专栏

java web

237 篇文章

订阅专栏

本文详细介绍了JavaWeb环境中，如何通过JS外部文件获取后台变量，包括控制器设置、页面隐藏域的使用及外部JS代码实现。重点展示了变量传递的过程和在外部JS文件中获取这些变量的具体方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

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

项目使用spring MVC框架，

IDE:eclipse；

使用maven构建

控制器（OsTypeController.java）如下：

package com.ct.web.controller;

import java.util.Date;
import java.util.List;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.SessionAttributes;

import com.ct.dao.OsTypeDao;
import com.ct.entity.OsType;
import com.time.util.TimeHWUtil;

@Controller
@RequestMapping("/osType")
@SessionAttributes("practiceWay")
public class OsTypeController {

	private OsTypeDao osTypeDao;
	private String redirectViewAll="redirect:/osType/viewAll";
	
	
	@RequestMapping(value = "/add")
	public String addInputOsType(String practiceWay,Model model){
		model.addAttribute("practiceWay", practiceWay);
		System.out.println("practiceWay:"+practiceWay);
		return "osType/addOSType";
	}
	
	/******************************************************************/
	public OsTypeDao getOsTypeDao() {
		return osTypeDao;
	}
	@Autowired
	public void setOsTypeDao(OsTypeDao osTypeDao) {
		this.osTypeDao = osTypeDao;
	}
	
	
}

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

<?xml version="1.0" encoding="UTF-8" ?>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://"
			+ request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!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>
<base href="<%=basePath%>">
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Insert title here</title> <script type="text/javascript"
		src="<%=path%>/static/js/Module.js"></script>
	<script type="text/javascript" src="<%=path%>/static/js/common_util.js"></script>
	<script type="text/javascript" src="<%=path%>/static/js/test.js"></script>
	
</head>
<body>
	<center>
	<h1><span id="titleSpan">add </span> </h1>
	<input type="hidden" value="${sessionScope.practiceWay}" name="hidpracticeWay" />
	<a href="javascript:history.go(-1)" >return </a>&nbsp;|&nbsp;
	<a href="index.jsp" >index</a>&nbsp;|&nbsp;<a href="osType/viewAll">view all</a>
		<form action="osType/save" name="inputform" >
			<table>
				<tr>
					<td>os name:</td>
					<td><input type="text" name="name" /></td>
				</tr>
				<tr>
					<td colspan="2" ><input type="submit"
						value="&nbsp;&nbsp;o&nbsp;k&nbsp;&nbsp;" id="submit_btn" /></td>
				</tr>
			</table>
			<div id="hidden_div"></div>
		</form>
	</center>
</body>
</html>

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

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

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

运行结果：

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

所以我们可以得出结论：

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

具体步骤：

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

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

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

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

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

请参阅我的下一篇日志

附件是项目，采用maven构建