Question

你能解释一下为什么以下代码在Chrome和Safari中不起作用，但只在Firefox中起作用吗？

if ($(this).css("color") == "Fuchsia"){ $(this).css("color","#000000"); }

这是链接：

http://www.sanstitre.ch/drupal/portfolio?tid[0]=38

如果你向下滚动，你会看到“永恒之旅”再次变成紫色和黑色，因为它不再被选中了。（使用FIrefox）

使用Chrome和Safari时，它仍然是黑色。

Answer 1

我会追踪返回$(this).color()的内容并查看，但我会说主要问题是，chrome / safari都返回hex code，因此与string进行比较不起作用

尝试将其与#FF00FF进行比较。

Answer 2

试试这个

if ($(*).css("color") == "fuchsia"){ $(this).css("color","#000000"); }

Answer 3

尝试将其拼写为小写：紫红色。

Answer 4

    function toggleNotesStyle(obj) {

    var currentColor = rgb2hex(jQuery(obj).css('color'));

    if (currentColor == '#000000') {  // if black, change to red
        jQuery(obj).css('color', '#ff0000');
    }
    else {  // if a different color (red in our case), change to black
        jQuery(obj).css('color', '#000000');
    }
}

function rgb2hex(rgb) {
    if (/^#[0-9a-f]{3}([0-9a-f]{3})?$/i.test(rgb)) {
        // matches on IE hex color (ie: #000000)  .. and no pun intended for "ie"
        return rgb;
    }
    // changes "rgb(#,#,#)' to hex for Mozilla, Chrome and Safari
        rgb = rgb.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
    // found this on another site, but don't know why it's different
    //rgb = rgb.match(/^rgba?\((\d+),\s*(\d+),\s*(\d+)(?:,\s*(\d+))?\)$/);
    return "#" +
        ("0" + parseInt(rgb[1], 10).toString(16)).slice(-2) +
        ("0" + parseInt(rgb[2], 10).toString(16)).slice(-2) +
        ("0" + parseInt(rgb[3], 10).toString(16)).slice(-2);
}

var timer;
toggleTimer();

function toggleTimer()
{
    if (document.getElementById("<%=fullDataEntryNotes.ClientID%>")) {
        var fullDataEntryNotes = document.getElementById("<%=fullDataEntryNotes.ClientID %>");
        toggleNotesStyle(fullDataEntryNotes);
    }

    timer = window.setTimeout('toggleTimer()', 750);
}

HTML代码打破了我的帖子，所以我将在这里解释HTML中的内容。制作一个div标签，并将文本放在其中。然后设置div标签的样式，使其最初具有＃000000（黑色）的style.color属性。然后每750毫秒，它将从黑色切换到红色，再从黑色切换到红色等。

jQuery：颜色变化不适用于Chrome和Safari

4 个答案: