js文件中使用el表達式問題

作者：Sang

單獨js文件不能用el表達式。

首先，JSP是由服務端執行的，EL表達式自然也由服務端解析執行，因此如果EL所在的腳本在JSP頁面內，它是可以獲取到值的，這個值在服務器端返回到瀏覽器端時已經解析完畢，瀏覽器端只是呈現而已，但是如果在單獨的JS文件中寫EL，會怎么樣呢？這個時候是無法獲取的，因為JavaScript是客戶端執行，單獨的JS文件不在服務器的解析執行之中，EL是不起任何作用的，這個時候它就等同於普通的字符串，那么如何解決這種情況呢？

一：可以通過window.onload()來得到EL的值再傳送給JS文件里的全局變量、方法進行變量初始化 。

二：可以在JSP頁面中添加一個隱藏域，給它賦值，在單獨的js文件中，通過獲取隱藏域的值就間接的獲取到了EL表達式的值。

舉例：

 jsp頁面（引用jQuery文件和register.js 添加兩個隱藏域）

<script type="text/javascript"  src="${pageContext.request.contextPath}/js/jquery-1.4.3.js"></script>  
<script type="text/javascript"  src="${pageContext.request.contextPath}/js/register.js"> </script>  
<input id="okPic" type="hidden" value="${pageContext.request.contextPath}/images/jsPic/ok.png"/>  
<input id="errorPic" type="hidden" value="${pageContext.request.contextPath}/images/jsPic/error.png"/>  

register.js文件（設置全局變量ok,error       $(function(){   });當引用這個js文件的頁面加載完畢就執行這個函數.相當於window.onload(),然后在其他函數中就可以直接引用ok,error全局變量.）

var ok ="";        
var error = "";  
$(function(){                               
    ok = $("#okPic").val();  
    error = $("#errorPic").val();  
});  

這樣就能獲得想要jsp中el表達式的值

在實際開發中，我們jsp頁面開發往往需要寫事件和方法，頁面和js邏輯都是分離，這樣容易造成有些變量是通過el表達式獲得，而在js里面我們需要使用el表達式獲得的值進行一些邏輯處理。

我的項目中遇到的舉例說明。

一：最常見的是url路徑請求：

jsp頁面獲得服務器地址：

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>  
<%@taglib prefix="spring" uri="http://www.springframework.org/tags" %>  
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>  
<%  
    String ctxPath = request.getContextPath();  
    request.setAttribute("ctxPath", ctxPath);  
    String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()  
            + ctxPath + "/";  
    request.setAttribute("basePath", basePath);  
%>  
<%@ page import="com.doron.sys.main.controller.PageURL" %>  
<%  
String pageUrl=PageURL.getUrl();  
%>  
<script>  
    var basePath = '<%=basePath%>';  
    var sessionAlert = '<spring:message code="itmp.tcs.inc.sessionAlert"/>';  
    function reload(data){  
        //if (res != null && res == "session_timeout") {  
        //  window.opener.location.href=basePath+"login.do";  
        //}  
        var status =data.getResponseHeader("sessionstatus");  
        if (data != null && status != null && status == 'timeout') {  
                messconfirm3(sessionAlert,function(){  
                    top.location.href=basePath+"login.do";  
                });  
                //alert('連接已超時請重新登錄！');  
            }  
    }  
</script>  

 

js頁面：

//到警和反饋初始化出警人信息  
function initArrivePerson(divId) {  
    var jqids = $("#jqid").val();//獲得警情id  
    $.ajax({  
         type:"post",     
         url:basePath + "kscj/findArrivePerson.do",  
         data:{"jqid":jqids},  
         dataType:"json",  
         async: false,  
         cache:false,  
         success : function(data) {  
             $("#"+divId).html("");  
             var arrivePerson="";  
             for (var i=0;i<data.length;i++) {  
                 arrivePerson+="<span>";  
                 arrivePerson+="<input type=\"checkbox\"  name=\"cjrxm\"  value=\'"+data[i].sjybh+"\'/><span>"+data[i].sjyxm+"</span>";  
                 arrivePerson+="<input type=\"hidden\"  name=\"cjdbh\"  value=\'"+data[i].cjdbh+"\'/>";  
                 arrivePerson+="</span>";  
             }  
             $("#"+divId).append(arrivePerson);   
         }  
    });  
}  

在jsp中引入需要的js文件，在jsp通過el獲得服務器地址baseBath，然后定義變量，則在js中直接獲得使用。