2

我正在尝试执行此过程:

  1. 查找所有以“i18n_”开头的类
  2. 捕获该类名,然后将该类的 .html 值设置为与该类同名的变量。

基本上,我有一个从服务器获取的列表,其中包含所有字符串,从 i18n_ 开始。例如 i18n_t23 = "Back" 什么的。我想把<span class="i18n_t23"></span>它的值设置为变量 i18n_t23。

目前我有大量的手工编码 $("span.i18n_t189").html(i18n_t189); 并且必须检查它们是否都在那里变得很累。必须有一种方法让它自动执行此操作。

谢谢!

4

4 回答 4

5

只需使用:

$('span[class^=i18n_]').text(
    function(){
        return this.className;
    });

值得注意的是,这会将元素的文本设置为元素的类名;aspan没有value属性,并且html()没有必要设置它(尽管在这种情况下它具有几乎相同的结果)。

顺便说一句,根据您的需要,您可以使用简单的 CSS 来模拟它(支持“现代”浏览器):

span[class=^=i18n_]::before {
    content: attr(class);
}

一种处理多个类的方法:

$('span[class]').filter(
    function(i, e) {
        var el = $(e),
            classes = el.attr('class').split(/\s+/);
        for (var i = 0, len = classes.length; i < len; i++) {
            var assessed = classes[i].indexOf('i18n_');
            if (assessed === 0) {
                el.data('classMatch',classes[i]);
                return true;
            }
        }
    }).text(function(){ return $(this).data('classMatch'); });​

JS 小提琴演示

以及一种处理查找的方法(使用返回的类名从对象中检索分配的值:

var lookup = {
    'i18n_something' : 'Something for the "something" suffixed class.',
    'i18n_somethingElse' : 'Something for the "somethingElse" version.',
    'i18n_AndSomethingElse' : 'And...well, you know the drill.'
};

$('span[class]').filter(
    function(i, e) {
        var el = $(e),
            classes = el.attr('class').split(/\s+/);
        for (var i = 0, len = classes.length; i < len; i++) {
            var assessed = classes[i].indexOf('i18n_');
            if (assessed === 0) {
                el.data('classMatch',classes[i]);
                return true;
            }
        }
    }).text(function(){ return lookup[$(this).data('classMatch')]; });​

JS 小提琴演示

于 2012-10-02T20:27:11.157 回答
1

这是一种方法:

    var _regClassMatch = /i18n_t([0-9]+)/;
    jQuery.each(jQuery('span'), function () {
        var _oCurrSpan = jQuery(this);
        var _sCurrClass = _oCurrSpan.attr('class');

        var _mClassMatch = _sCurrClass.match(_regClassMatch);
        if (_mClassMatch) {
            alert(_mClassMatch[1]);
        }
    });

_mClassMatch[1] 是您的数值,_oCurrSpan 对象是您当前的跨度。只需在 document.ready 上运行它。

于 2012-10-02T20:47:25.847 回答
1

你试一下。 $("*[class*='i18n_']).attr("class")或者当元素只有一个类名时$("*[class^='i18n_']).attr("class")

于 2012-10-02T20:31:58.970 回答
0

我建议您稍微更改设置,从而简化您拥有的 javascript 代码:

<div data-i18="a">a</div>

<div data-i18="b">b</div>

var i18 = { a: 'a2', b: 'b2' }

$('div[data-i18]').each(function(ind, el) {
    var key = $(el).data('i18')
    $(el).html(i18[key])        
});​

// or in case of global variables 

$('div[data-i18]').each(function(ind, el) {
    var key = $(el).data('i18')
    $(el).html(window[key])        
});​

i18_something因此,您要设置自定义数据属性 data-i18 并将值放在这里,而不是 class 。

于 2012-10-02T20:38:04.013 回答