我正在将我的网站设为多语言。因此,当单击语言按钮时,我通过 jQuery 更改文本。这对于所有文本都非常有效,但不适用于我在导航中用于悬停效果的链接的标题属性。
链接如下所示:
<div class="nav-container">
<!-- Navigation for Portfolio -->
<div class="nav" id="services">
<a href="#" class="thumb tr" title="Leistungen" key="menu_business"><span><img src="images/menu_icons/services.png" alt="" /></span></a>
</div>
</div>
对于我使用的文本,例如(有效!):
<h4 class="jobtitle tr" key="companyfield">blabla</h4>
我的函数如下所示:
$(document).ready(function() {
// onclick behavior
$('.lang').click( function() {
var lang = $(this).attr('id'); // obtain language id
// translate all translatable elements
$('.tr').each(function(i) {
if($(this).attr('key').indexOf("menu_") == 0) {
$(this).attr('title', aLangKeys[lang][ $(this).attr('key') ]);
} else {
$(this).text(aLangKeys[lang][ $(this).attr('key') ]);
}
});
});
});
用作字典的数组在这里初始化:
var aLangKeys = new Array();
aLangKeys['de'] = new Array();
aLangKeys['en'] = new Array();
aLangKeys['de']['menu_business'] = 'Leistungen';
aLangKeys['en']['menu_business'] = 'Business';
使用 Firebug 调试函数时,标题为空,但我可以正确看到所有其他属性,例如 href
或 class
。
我尝试使用 .prop
(>= jquery 1.6)、.attr
(< jquery 1.6) 读取/写入 title
和原生 JavaScript .title
。这些都不起作用。
我使用的 jQuery 包括:
<!-- include jQuery library -->
<script type="text/javascript" src="js/jquery-1.4.4.min.js"></script>
<!-- jquery tools script -->
<script type="text/javascript" src="js/jquery.tools.min.js"></script>
<!-- jqtransform script for forms -->
<script type="text/javascript" src="js/jquery.easing.1.3.js"></script>
<script type="text/javascript" src="js/jquery.tinyscrollbar.min.js"></script>
最佳答案
我认为您可以使用语言代码属性和语言选择器:
http://www.w3schools.com/tags/ref_language_codes.asp
http://api.jquery.com/lang-selector/
您可以通过 CSS 或 Javascript/JQuery 设置 HTML 元素的可见性,代码更少,灵 active 更高,如下所示:
$('.lang').click( function() {
var lang = $(this).attr('id'); // obtain language id
// translate all translatable elements
$('div[lang]').css('display','none');
$(':lang('+lang+')').css('display','initial');
} );
使用重复的 html 元素(通过 CSS 隐藏辅助语言):
<div lang="de">blabla deutch</div>
<div lang="en">blabla english</div>
关于javascript - 无法更改链接的标题属性,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23761384/