Question

我有一个名为index.jsp的JSP页面，它实现了一个简单的下拉菜单，其中包含两个选项，英语和法语。

JSP代码：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1" pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<c:set var="language" value="${not empty param.language ? param.language : not empty language ? language : pageContext.request.locale}" scope="session" />
<fmt:setLocale value="${language}" />
<fmt:setBundle basename="com.labels.text" />
<html lang="${language}">
<link rel="stylesheet" href="css/style.css" media="screen" type="text/css">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>Login Application</title>
</head>
<body>
    <section>
        <span></span>
        <h1>Member Login</h1>
        <form action="loginServlet" method="post">
        <fmt:message key="login.label.username" var="usernameLang" />
        <input type="text" name="username" required="required" placeholder="${usernameLang}" />
        <fmt:message key="login.label.password" var="passwordLang" />
        <input type="password" name="userpass" required="required" placeholder="${passwordLang}" />
        <fmt:message key="login.label.loginB" var="loginButton" />
        <button type="submit" value="${loginButton}" >${loginButton}</button>
            <%if(request.getAttribute("error") != null){ //If error attrubite exists, alert user to bad user/pw combo
                out.print("<div class=\"error\">Sorry, username or password incorrect</div>");
            } else{
                out.print("<div class=\"error\"></div>");
            }
            %>
        </form>
        <h2>
            <fmt:message key="login.label.createAccount" var="createAcc" />
            <a href='createAccount.jsp'>${createAcc}</a>
            <br />
            <fmt:message key="login.label.forgotPass" var="forgotPass" />
            <a href='#'>${forgotPass}</a>
            <br /><br />
            <fmt:message key="login.label.selectLang" var="Lang" />${Lang}&nbsp;
            <select id="language" name="language">
                <option value="en" ${language == 'en' ? 'selected' : ''}>English</option> <!--  Selects English as the Language for the page -->
                <option value="fr" ${language == 'fr' ? 'selected' : ''}>franÃ§ais</option> <!--  Selects French as the Language for the page -->
            </select>
        </h2>
    </section>
</body>

<script src="//code.jquery.com/jquery-1.11.2.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("#language").change(function (){
            var selected;
            selected = $('#language').find(":selected").val();
            if(selected === "fr"){<%session.setAttribute("language", "fr");%> alert("changing to french...");}
            else if(selected === "en") {<%session.setAttribute("language", "en");%> alert("changing to eng...");}
            location.reload(); 
        });
    });
</script>
</html>

底部的脚本应该将会话语言更改为在下拉菜单中选择的语言，但它不起作用（语言不会更改）。

网页必须是JSP页面。我可以使用任何类型的脚本，但我不能改变网页的类型。

如何使用选择框使用脚本更改会话语言？谢谢！

Answer 1

您无法使用客户端脚本（Jquery）来触发服务器端事件。你可以做的是有一个servlet，它接受一个参数（语言）并在你的会话中设置该参数。然后使用jQuery ajax请求来调用该servlet。

setLangServlet.java

protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException
{
    String lang= request.getParameter("lang");
    request.setAttribute("language", lang);
    response.setContentType("text/plain");
    response.getWriter().write("Successfully set"+lang+" in session"); 
}

JSP：

<script type="text/javascript">
$(function () {
 $("#language").change(function (){
   var selected = $('#language').find(":selected").val();
  $.get('${pageContext.request.contextPath}/setLang?lang=selected,  
        function(response) {
          console.log(response);
        });
        location.reload(); 
    });
});

如何使用HTML下拉菜单更改JSP页面的网页语言？

1 个答案: