Question

我正在尝试更改循环中td元素的类但是我真的没有一个有效的解决方案，有人可以帮助我，请提前感谢。

HTML：

<tr>
    <td>VAR (%)</td>
    <td class="text-primary"> <i class="" id="varperc1"></i></td>
    <td class="text-primary"> <i class="" id="varperc2"></i></td>
    <td class="text-primary"> <i class="" id="varperc3"></i></td>
    <td class="text-primary"> <i class="" id="varperc4"></i></td>
    <td class="text-primary"> <i class="" id="varperc5"></i></td>
    <td class="text-primary"> <i class="" id="varperc6"></i></td>
    <td class="text-primary"> <i class="" id="varperc7"></i></td>
</tr>

SCRIPT：

 $.post(url, filteredObject, function (data) {
    for (i = 0; i < 7; i++) {
        $('#varperc' + (i + 1).toString()).text(numberWithCommas(data[i].varperc));

        var cls = parseInt($('#varperc' + (i + 1).toString()).text());

        if (cls < 0) {
            $('#varperc' + (i + 1).toString()).addClass("fa fa-level-down");
            $('#varperc' + (i + 1).toString()).removeClass("fa-level-up");
            $('.text-primary').removeClass('primary');
            $('.text-').addClass('warning');
        }
        else {
            $('#varperc' + (i + 1).toString()).addClass("fa fa-level-up");
            $('#varperc' + (i + 1).toString()).removeClass("fa-level-down");
            $('.text-primary').removeClass('primary');
            $('.text-').addClass('navy');
        }
    }
});

Answer 1

你有

$('.text-primary').removeClass('primary')

我假设你想要

$('.text-primary').removeClass('text-primary')

您可以使用

添加其他类

$('.text-primary').removeClass('text-primary').addClass('navy')

然后，

$('.text-').addClass('navy');

已经过时了（我认为它以前没有用过）。

请参阅removeClass文档。

Answer 2

根据您的评论，您想要更改.text-primary类，我假设您希望将其更改为“text-navy”或“text-warning”。在这种情况下改变：

 $('.text-primary').removeClass('primary');
 $('.text-').addClass('navy');

到：

$('.text-primary').removeClass('text-primary');
$('.text-').addClass('text-navy');

Answer 3

这是因为没有课程primary，css课程不会以这种方式工作，你只需.text-primary成为.text-navy所以你应该这样做删除.text-primary并添加.text-navy课程。或者您可以更改系统以使用这些类。

您可以考虑使用以上代码：

 var $varperc = $('#varperc' + (i + 1).toString());

 $varperc
    .closest('.text-primary')
    .removeClass('text-primary')
    .addClass('text-navy');

Answer 4

我认为更好和动态的方法是使用$ .each循环的jquery

尝试像

你的HTML

UIView+XXXXXX.m

@implementation UIView (XXXXXX)

- (void) awakeFromNib {

    /* some code here */

}

和js

<table>
    <tr>
    <td class="text-primary"> <i class="" id="varperc1"></i></td>
    <td class="text-primary"> <i class="" id="varperc2"></i></td>
    <td class="text-primary"> <i class="" id="varperc3"></i></td>
    <td class="text-primary"> <i class="" id="varperc4"></i></td>
    <td class="text-primary"> <i class="" id="varperc5"></i></td>
    <td class="text-primary"> <i class="" id="varperc6"></i></td>
    <td class="text-primary"> <i class="" id="varperc7"></i></td>
</tr>

</table>

改变元素类

4 个答案: