在文本框中輸入文字時，使用jQuery更改圖標的顏色

Question

我在其中有一個文本框和一個用於電子郵件的信封圖標，如下所示：

<input id="AdminEmail" name="AdminEmail" style="width:100%;padding-right:30px;" type="text" value="">
<span class="glyphicon glyphicon-envelope  form-control-feedback" style="right: 10px; line-height: 27px; color: lightblue"></span>

然后，我添加了jQuery以更改電子郵件圖標的顏色（如果他們輸入的電子郵件正確或不正確）。 當我使用“ alert ”時它起作用了，但是當我想實際更改顏色而不顯示alert時卻不起作用。

$("#AdminEmail").keyup(function () {
    var $email = $(this).val();
    validateEmail($email);
});
function validateEmail($email) {
    var emailReg = /^([\w-\.]+@([\w-]+\.)+[\w-]{2,4})?$/;
    if (!emailReg.test($email)) {
        $(".glyphicon-envelope").CSS('color', 'red');
    } else {
        $(".glyphicon-envelope").CSS('color', 'blue');
    }
}

Answer 1

我相信您的問題是CSS需要小寫。

$(".glyphicon-envelope").css('color', 'red');

如果您想變得真正聰明，可以將整個部分合並為

$(".glyphicon-envelope").css('color', emailReg.test($email) ? 'blue' : 'red');

Answer 2

簡單...

只需更改為.css（'color'....）

沒有上限