Question

我有这个脚本会附加一个列表项，如果它没有全部存在的话。我想要它做的是，如果列表项已经存在，它的字体颜色（css）被设置为另一种颜色。

var itemName = userName,
    userFound = false;

$('#msgUserlist li').each(function () {
    if ($(this).text() === itemName) {
        userFound = true;
    }
});

if (userFound === true) {
    ////// at this point i want the fontcolor of the allready existing item be set.///
    return;
} else
    var newNode = document.createElement('li');
    newNode.innerHTML = '<a id="switchtoUser" name="' + userName + '" ' + 'onclick="ajaxChat.getHistory' + '(\'' + userName + '\')"' + ' href="javascript:ajaxChat.sendPrivateMessageWrapper(\'/query ' + userName + '\');">' + userName + '</a>';
    document.getElementById('msgUserlist').appendChild(newNode);
},

Answer 1

当您搜索用户时，您可以在循环浏览列表时执行此操作：

// ...snip

$('#msgUserlist li').each(function () {
    if ($(this).text() === itemName) {
        userFound = true;
        $(this).css({
            color: "blue" // or whatever
        });
        return;
    }
});

// ...snip

Answer 2

你找到它的那一刻为什么不这样做？

if ($(this).text() === itemName) {
    userFound = true;
    $(this).css('color', 'red'); // Example: change the color to red
}

Answer 3

我认为这可以通过Jquery函数css（）

很好地解决

<强> HTML

<ul id=msgUserlist>
    <li>Foo</li>
    <li>userName</li>
    <li>tball rulez</li>
</ul>

<强>的Javascript

var itemName = 'userName';

$( document ).ready(function() {
    $("#msgUserlist li").each(function() {
        if($(this).text() == itemName )
            $(this).css("color", "red");
    })
})

参见工作示例（简单，但可以使用您在问题中列出的逻辑进行扩展！）：http://jsfiddle.net/PGfgv/601/

如果列表项存在，则不附加但更改字体颜色

3 个答案: