Javascript 链接的颜色转换在Firefox中不起作用

因此，我的页面上有一个电子邮件链接，当你将鼠标悬停在它上面时，它应该从底色（浅绿色）过渡到深绿色。我已经确认它在Chrome、IE、Edge和Opera中都能正常工作。它只在Firefox中不起作用。我也有它，当你把鼠标悬停在它上面时，它在链接的底部做了同样的事情，在Firefox中效果很好，只是因为某种原因链接的颜色不一样。任何帮助都将不胜感激。这是我的密码：

HTML:

JavaScript:

//This function is to copy the emails on each page to the clipboard and to style the link
//once it is clicked when the emails are clicked.
function CopyEmail(id) {
    var range = document.createRange();
    var selection = window.getSelection();
    SelectEmailCopying(id, range);
    RemoveAllRanges(selection);
    selection.addRange(range);
    document.execCommand('copy');
    RemoveAllRanges(selection);
}

//this function creates the range for the text of the email that is to be copied.
function SelectEmailCopying(id, range) {
    if(id === "green_email_one") {
        range.selectNodeContents(document.getElementById('green_email_one'));
    }
    else if(id === "green_email_two") {
        range.selectNodeContents(document.getElementById('green_email_two'));
    }
    else if(id === "grey_email_one") {
        range.selectNodeContents(document.getElementById('grey_email_one'));
    }
    else if(id === "grey_email_two") {
        range.selectNodeContents(document.getElementById('grey_email_two'));
    }
    else if (id === "grey_email_three") {
        range.selectNodeContents(document.getElementById('grey_email_three'));
    }
    else if(id === "drop_down_menu_email") {
        range.selectNodeContents(document.getElementById('drop_down_menu_email'));
    }
    else if(id === "wider_screen_drop_down_menu_email") {
        range.selectNodeContents(document.getElementById('wider_screen_drop_down_menu_email'));
    }
}

//This function removes all ranges once copying is done.
function RemoveAllRanges(selection) {
    selection.removeAllRanges();
}

$(document).ready(function() {
    //Gives animation to the last email link before hitting the footer on hover
    $("#green_email_one").hover(function() {
        $("#green_email_one").addClass("green_email_one_border_animation");
    }, function() {
        $("#green_email_one").removeClass("green_email_one_border_animation");
    });
});

以及此代码的JSFIDLE链接：

---

谢谢。

您有

的这部分代码！重要信息

.component-header__left-div__nav_active_a,
.component-div_margin__email_color,
a:hover,
.wider_screen_size_header_navigation_nav a:hover {
    color: red !important;//I added red as color for testing
}

---

只需删除重要的

怪异，我想我需要它！对于我的代码的其他部分来说，这很重要，但显然它们在没有它的情况下也能工作。但不管怎样，这确实奏效了。非常感谢！没问题，我很高兴我能帮上忙这是我第三次成功的回答：D

//This function is to copy the emails on each page to the clipboard and to style the link
//once it is clicked when the emails are clicked.
function CopyEmail(id) {
    var range = document.createRange();
    var selection = window.getSelection();
    SelectEmailCopying(id, range);
    RemoveAllRanges(selection);
    selection.addRange(range);
    document.execCommand('copy');
    RemoveAllRanges(selection);
}

//this function creates the range for the text of the email that is to be copied.
function SelectEmailCopying(id, range) {
    if(id === "green_email_one") {
        range.selectNodeContents(document.getElementById('green_email_one'));
    }
    else if(id === "green_email_two") {
        range.selectNodeContents(document.getElementById('green_email_two'));
    }
    else if(id === "grey_email_one") {
        range.selectNodeContents(document.getElementById('grey_email_one'));
    }
    else if(id === "grey_email_two") {
        range.selectNodeContents(document.getElementById('grey_email_two'));
    }
    else if (id === "grey_email_three") {
        range.selectNodeContents(document.getElementById('grey_email_three'));
    }
    else if(id === "drop_down_menu_email") {
        range.selectNodeContents(document.getElementById('drop_down_menu_email'));
    }
    else if(id === "wider_screen_drop_down_menu_email") {
        range.selectNodeContents(document.getElementById('wider_screen_drop_down_menu_email'));
    }
}

//This function removes all ranges once copying is done.
function RemoveAllRanges(selection) {
    selection.removeAllRanges();
}

$(document).ready(function() {
    //Gives animation to the last email link before hitting the footer on hover
    $("#green_email_one").hover(function() {
        $("#green_email_one").addClass("green_email_one_border_animation");
    }, function() {
        $("#green_email_one").removeClass("green_email_one_border_animation");
    });
});

.component-header__left-div__nav_active_a,
.component-div_margin__email_color,
a:hover,
.wider_screen_size_header_navigation_nav a:hover {
    color: red !important;//I added red as color for testing
}