前台页面的国际化处理

下面我就以登录为例子。

 <script src="./login/login.js"></script>
<script type="text/javascript" src="./resources/lib/jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="./resources/lib/jquery.i18n.properties-1.0.9.js"></script>

  <form class="ui large form">

      <div class="column">
        <div class="ui form">
          <div class="field">

            <div class="ui left icon input">
              <input type="text" placeholder="Username" name="account" id="account">
              <i class="user icon"></i>
            </div>
          </div>
          <div class="field">
            <div class="ui left icon input">
              <input type="password" name="password" placeholder="password" id="pwd">
              <i class="lock icon"></i>
            </div>
          </div>
          <div class="ui  buttons">
            <button class="ui teal button" id = "login" value="login"></button>
            <div class="or"></div>
            <button class="ui button" id="register" value="register" οnclick="window.location='http://localhost:8080/webpages/signup.html';return false;"></button>
          </div>
        </div>
      </div>
    </form>
js部分代码

$(document).ready(function() {
	/*var lang;
	var type=navigator.appName;
	if (type=="Netscape"){
	 lang = navigator.language;
	}
	else{
	 lang = navigator.userLanguage;
	}
	//取得浏览器语言的前两个字母
	var language = lang.substr(0,2);*/
	loadProperties();
	
	
});
function loadProperties(){
	jQuery.i18n.properties({//加载资浏览器语言对应的资源文件
		name:'strings', //资源文件名称
		path:'./resources/i18n/', //资源文件路径
		mode:'map', //用Map的方式使用资源文件中的值
		callback: function() {//加载成功后设置显示内容
			//用户名
			$("#account").attr("placeholder",$.i18n.prop('string_username'));
			//密码
			$("#pwd").attr("placeholder",$.i18n.prop('string_password'));
		    //登录
			$('#login').html($.i18n.prop('string_login'));
			$('#login1').html($.i18n.prop('string_login'));
			//注册
			$('#register').html($.i18n.prop('string_register'));
		}
	});
}

配置文件 strings_en.properties

string_username=User name
string_password=Password
string_login=Login

项目目录结构







已标记关键词 清除标记
©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页