关闭

利用Intellij+MAVEN+SpringMVC+URI.js实现页面的中英文切换(国际化)

1693人阅读 评论(0) 收藏 举报
分类:

 利用Intellij+MAVEN+SpringMVC+URI.js实现页面的中英文切换(国际化)

一个页面经常会有中英文切换的功能,今天就使用SpringMVC实现一个通过链接实现页面中英文切换的小DEMO。

一  配置文件

1 MAVEN的配置文件pom.xml(后面使用到了jstl标签,所以也需要导入这个包):

<project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
  <modelVersion>4.0.0</modelVersion>
  <groupId>TestSpringMVC2</groupId>
  <artifactId>TestSpringMVC2</artifactId>
  <packaging>war</packaging>
  <version>1.0-SNAPSHOT</version>
  <name>TestSpringMVC2 Maven Webapp</name>
  <url>http://maven.apache.org</url>

  <dependencies>
    <dependency>
      <groupId>junit</groupId>
      <artifactId>junit</artifactId>
      <version>3.8.1</version>
      <scope>test</scope>
    </dependency>

      <dependency>
        <groupId>org.springframework</groupId>
        <artifactId>spring-jdbc</artifactId>
        <version>3.0.5.RELEASE</version>
      </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-test</artifactId>
      <version>4.3.1.RELEASE</version>
    </dependency>
    <!--spring-->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-beans</artifactId>
      <version>4.3.1.RELEASE</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-core</artifactId>
      <version>4.3.1.RELEASE</version>
    </dependency>

    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-context</artifactId>
      <version>4.3.1.RELEASE</version>
    </dependency>

    <!--Spring Web + Spring MVC-->
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-web</artifactId>
      <version>4.3.1.RELEASE</version>
    </dependency>
    <dependency>
      <groupId>org.springframework</groupId>
      <artifactId>spring-webmvc</artifactId>
      <version>4.3.1.RELEASE</version>
    </dependency>

    <!--NoClassDefFoundError: javax/servlet/jsp/jstl/core/Config-->
    <!-- https://mvnrepository.com/artifact/javax.servlet/jstl -->
    <dependency>
      <groupId>javax.servlet</groupId>
      <artifactId>jstl</artifactId>
      <version>1.2</version>
    </dependency>

    <dependency>
      <groupId>taglibs</groupId>
      <artifactId>standard</artifactId>
      <version>1.1.2</version>
    </dependency>


    <!-- https://mvnrepository.com/artifact/javax.servlet.jsp/jsp-api -->
    <dependency>
      <groupId>javax.servlet.jsp</groupId>
      <artifactId>jsp-api</artifactId>
      <version>2.2</version>
    </dependency>


  </dependencies>

  <build>
    <finalName>TestSpringMVC2</finalName>

    <resources>
      <!--表示把java目录下的有关xml文件,properties文件编译/打包的时候放在resource目录下-->
      <resource>
        <directory>${basedir}/src/main/java</directory>
        <includes>
          <include>**/*.properties</include>
          <include>**/*.xml</include>
        </includes>
      </resource>
      <resource>
        <directory>${basedir}/src/main/resources</directory>
      </resource>
    </resources>
    <plugins>
      <!--servlet容器 jetty插件-->
      <plugin>
        <groupId>org.eclipse.jetty</groupId>
        <artifactId>jetty-maven-plugin</artifactId>
        <version>9.3.10.v20160621</version>
      </plugin>
    </plugins>
  </build>
</project>


2  web.xml中配置SpringMVC的一些信息:

<!DOCTYPE web-app PUBLIC
 "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN"
 "http://java.sun.com/dtd/web-app_2_3.dtd" >
  <web-app xmlns="http://java.sun.com/xml/ns/javaee"
           xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
           xsi:schemaLocation="http://java.sun.com/xml/ns/javaee
          http://java.sun.com/xml/ns/javaee/web-app_3_0.xsd"
           version="3.0">

    <!--配置springmvc DispatcherServlet-->
    <servlet>
          <servlet-name>springMVC-servlet</servlet-name>
          <servlet-class>org.springframework.web.servlet.DispatcherServlet</servlet-class>
          <init-param>
               <param-name>contextConfigLocation</param-name>
              <param-value>classpath:springMVC-servlet.xml</param-value>
           </init-param>

         <load-on-startup>1</load-on-startup>
    </servlet>

    <servlet-mapping>
        <servlet-name>springMVC-servlet</servlet-name>
        <url-pattern>/</url-pattern>
    </servlet-mapping>

    <!-- 配置HiddenHttpMethodFilter:把POST 请求转为DELETE/PUT 请求-->
    <filter>
        <filter-name>HiddenHttpMethodFilter</filter-name>
        <filter-class>org.springframework.web.filter.HiddenHttpMethodFilter</filter-class>
    </filter>
    <filter-mapping>
        <filter-name>HiddenHttpMethodFilter</filter-name>
        <url-pattern>/*</url-pattern>
    </filter-mapping>

    <context-param>
      <param-name>contextConfigLocation</param-name>
      <param-value>classpath:applicationContext.xml</param-value>
    </context-param>

      <listener>
        <listener-class>org.springframework.web.context.ContextLoaderListener</listener-class>
      </listener>

</web-app>

配置SpringMVC 的配置文件,这里关于国际化的配置有

1)配置国际化资源文件
2)配置SessionLocaleResolver
3) 配置LocaleInterceptor
<?xml version="1.0" encoding="UTF-8"?>
<beans xmlns="http://www.springframework.org/schema/beans"
       xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
       xmlns:context="http://www.springframework.org/schema/context"
       xmlns:mvc="http://www.springframework.org/schema/mvc"
       xsi:schemaLocation="http://www.springframework.org/schema/beans
http://www.springframework.org/schema/beans/spring-beans-3.1.xsd
http://www.springframework.org/schema/context
http://www.springframework.org/schema/context/spring-context-3.1.xsd
http://www.springframework.org/schema/mvc
http://www.springframework.org/schema/mvc/spring-mvc-3.1.xsd">
    <mvc:annotation-driven />
    <mvc:default-servlet-handler/>

    <!-- 启动包扫描功能 -->
    <context:component-scan base-package="com.springmvc.crud" />

    <!-- 对模型视图名称的解析,在请求时模型视图名称添加前后缀 -->
    <bean id="viewResolverCommon" class="org.springframework.web.servlet.view.InternalResourceViewResolver">
        <property name="prefix" value="/WEB-INF/views/"/>
        <property name="suffix" value=".jsp"/>
        <property name="viewClass"  value="org.springframework.web.servlet.view.JstlView" />
    </bean>

    <!--配置国际化资源文件-->
    <bean id="messageSource" class="org.springframework.context.support.ResourceBundleMessageSource">
        <property name="basename" value="i18n"></property>
    </bean>

    <!--配置SessionLocaleResolver-->
    <bean id="localeResolver" class="org.springframework.web.servlet.i18n.SessionLocaleResolver">
    </bean>

    <!--配置LocaleInterceptor-->
    <mvc:interceptors>
        <bean class="org.springframework.web.servlet.i18n.LocaleChangeInterceptor"></bean>
    </mvc:interceptors>

    <!-- 处理静态资源 -->
    <mvc:default-servlet-handler/>
    <mvc:annotation-driven></mvc:annotation-driven>
    <!--  conversion-service="conversionService"加在 mvc:annotation-driven后,在格式化时应去除 -->

</beans>
注意!


4  配置国际化文件:

i18n_en_US.properties
i18n.username=Username_en
i18n.password=Password_en
i18n_zh_CN.properties
i18n.username=姓名
i18n.password=密码

二、显示页面i18n.jsp

<%--
  Created by IntelliJ IDEA.
  User: WGS
  Date: 2017/1/1
  Time: 23:21
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<html>
<head>
    <title>I18N  PAGE</title>
</head>
<body>

    <h2>I18N  PAGE</h2>
    <br>
    <a href="i18n?locale=zh_CN">中文</a>
    <a href="i18n?locale=en_US">英文</a>
    <br><br>
    show:
    <br>
    <fmt:message key="i18n.username"></fmt:message>
    <br>
    <fmt:message key="i18n.password"></fmt:message>
    <br>

</body>
</html>

三、成功显示,如下图片所示:
--------------------------------------------Updated on 2017-1-11---------------------------------------------------
 
上面是通过点击两个链接来切换页面的中英文设置,这次将这两个链接的切换功能集成到一个按钮中,通过点击按钮自动实现页面的中英文切换。

什么是URI?

实现这个小功能可用URI.js这个javascript库用于处理URLs地址。它提供了类似于jQuery风格的API(便利的接口和方法链)。
关于URI.js,可参看文档:【http://medialize.github.io/URI.js/docs.html#search-set】

如何实现?

首先要引入这个包:
 <script src="//cdn.bootcss.com/URI.js/1.18.3/URI.min.js"></script>

然后通过与jQuery结合即可实现:
<%--
  Created by IntelliJ IDEA.
  User: WGS
  Date: 2017/1/1
  Time: 23:21
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@taglib prefix="spring" uri="http://www.springframework.org/tags" %>

<html>
<head>

    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="//cdn.bootcss.com/bootstrap/3.3.5/css/bootstrap.min.css">

    <script type="text/javascript" src="scripts/jquery-1.7.2.js"></script>
    <script src="//cdn.bootcss.com/URI.js/1.18.3/URI.min.js"></script>
</head>
<script>
    $(document).ready(function(){
        $(".i18n-choose").click(function () {
            var uri = new URI();
            uri.setSearch("locale",$(this).attr("data-language"));
            location.href = uri.toString();
        });
    });

</script>

<style type="text/css">
    .i18n-choose {
        cursor: pointer;
    }
    .i18n-choose hover{
        text-decoration: underline;
    }
</style>

<body>

    <h2>I18N  PAGE</h2>
    <br>
    <a>
        <span class="i18n-choose" data-language="zh_CN">中文</span>     |  
        <span class="i18n-choose" data-language="en_US">English</span>
    </a>
    <br><br>
    show:
    <br>
    <table class="table table-striped" border="1" cellspacing="0" cellpadding="10">
        <tr >
            <td><fmt:message key="i18n.username"></fmt:message></td>
        </tr>
        <tr>
            <td><fmt:message key="i18n.password"></fmt:message></td>
        </tr>
    </table>

</body>
</html>
上述代码引入了bootstrap和CSS样式,使显示页面美观点。

显示页面如下:




























然后通过与jQuery结合即可实现:
0
0
查看评论
发表评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场

SpringMvc+JS实现基于session的国际化

  • 2016-05-10 18:33
  • 580KB
  • 下载

SpringMvc中的国际化中文和英文互换

1.java代码 package com.eduask.controller; import java.util.Locale; import org.springframework...
  • lvjinhan
  • lvjinhan
  • 2016-08-26 16:26
  • 1959

SpringMVC 国际化-中英文切换

国际化是为了实现不同地区页面呈现不同的语言问题; 编写程序实现国际化,在xml文件中做响应的配置,然后编写.properties文件即可。 实现登录界面的中英文切换: x...
  • ldw201510803006
  • ldw201510803006
  • 2017-10-19 22:02
  • 340

ASP.NET网站实现中英文转换(本地化资源)

主要内容: 1. 简单例子 2. 进一步认识Localization 3. 语言转换 4. 解决方案 一. 简单例子 下面通过一个简单的例子来说明利用Localization来实现本地化是...
  • anchenyanyue
  • anchenyanyue
  • 2011-09-27 16:38
  • 4986

JAVA WEB上的多语言切换

因为在项目目前是验证demo阶段,所以功能能够支持的越多越好 so leader让我添加一个中英文切换功能 经过各种search后,初步实现了这个功能,下面把方法告诉给大家,仅供参考,如果有更好的方案...
  • wuhawang
  • wuhawang
  • 2016-08-17 10:33
  • 6565

SPring MVC i18n 国际化使用流程Demon(Maven项目的搭建和web、spring框架的添加)

spring MVC测试国际化,Maven项目的搭建以及web、spring框架的整合。
  • u013361445
  • u013361445
  • 2015-07-29 16:45
  • 1995

i18n国际化插件

  • 2017-12-14 09:41
  • 168KB
  • 下载

Java中如何将中文转换为英文String

中文转换为拼音String
  • whale_kyle
  • whale_kyle
  • 2016-06-03 11:30
  • 4976

java web 项目实现手动中英文切换

java国际化实现思路     Java程序的国际化思路是将程序中的标签、提示信息等放在资源文件中,程序需要支持国家/语言环境,则必须提供对应的资源文件。资源文件是key-value对,每个资源文件中...
  • ldybing
  • ldybing
  • 2016-08-16 12:17
  • 5600

java 实现国际化 中英文语言切换

  • 2013-11-29 11:25
  • 3.02MB
  • 下载
    个人资料
    • 访问:202095次
    • 积分:3257
    • 等级:
    • 排名:第12171名
    • 原创:191篇
    • 转载:10篇
    • 译文:0篇
    • 评论:166条
    联系方式
    博客专栏
    最新评论