JSP与JS相互传值相关问题

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/qqHJQS/article/details/50302535
这个问题很久之前就想到了,只不过中间一直在忙就忘掉了,今天在做新系统时,看到了另一种的写法,借此机会,就想把这个问题翻出来,理一理。。。我说的这个传值不是指html标签里的属性或者text,而是一些需要从后台获取值,然后将值传递到js文件中使用,如下面
<%@page import="com.value.demo.ObtainValue"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%
String value = ObtainValue.getStrValue();
%>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript">
var valueJs = "<%=value%>";
</script>
<script type="text/javascript" src="index.js"></script>

<title>Insert title here</title>
</head>
<body>
<input type="button" id='button' value="click me" onclick="Index.alertStr();">
</body>
</html>

我现在使用的是这样的写法,js与jsp值以“var value = “<%=value%>”;”这样的方式来实现值在js与jsp之间的传递,这里要注意的是,引入的js文件一定要写在后面,否则页面加载完有会报XXX is undefined。。。

这样js就可以直接使用valueJs。

这样写法虽简单,但是有时会让人一头雾水,当别人来接管这一块的代码的时候,他会在js代码里找不到这个变量定义的地方,因为这个变量是在jsp页面定义的,自己就遇到过这个问题,找了半天突然醒悟,原来是在jsp里。

今天遇到另一种写法,js是这样写的

var Index2 = function(){
    var value = "";

    return {
        setValue:function(s){
            value = s;
        },
        getValue:function(){
            return value;
        },
        alertStr : function(){
            alert(value);
        }
    }
}();

注意set和get方法,

jsp再这样写

<script type="text/javascript" src="index2.js"></script>
<script type="text/javascript">
Index2.setValue("<%=value%>");
</script>

让我奇怪的事来了,使用set之后,不需要使用get方法,就可以在js里使用value这个变量了。后来发觉是上面js的方法自动解析get方法,分然后value就有值了。。。

这里要注意的是,js引入的代码要写在前面。

以上两种方法都能完成传值,那么问题来了。。。学挖掘机哪家强?

开玩喜了,现在就想研究一下这两种方法的执行效率和可维护性哪个更高一些,说白了就是哪个比较正规一些。。。。

这些问题有待解决。。。

阅读更多
换一批

没有更多推荐了,返回首页