如何使用jquery設置texbox的邊框顏色

Question

如何使用jquery設置控件的默認邊框顏色。

 if (_userName.val().trim() == "") { 
      errMsg += "\nUserName is a mandatory field."; 
      _userName.css('border-color', 'red'); 
     } 
     else { 
      _userName.css('border-color', 'red');//Set border-color as loaded 
//when page was loaded 
     } 

如何在加載頁面時將邊框顏色設置爲加載。

Answer 1

獲取在頁面加載和存儲邊框顏色在一個變量：

$(function(){ 
    var color = _userName.css('border-color'); 
}); 

然後你就可以在以後使用它：

if (_userName.val().trim() == "") { 
     errMsg += "\nUserName is a mandatory field."; 
     _userName.css('border-color', color); 
    } 
    else { 
     _userName.css('border-color', color); 
    } 

另外，還要確保有一個邊界，至少如border:1px solid #colorcode

Answer 2

我想給html元素改變一個指定顏色的css類。

只需卸下邊框顏色將其重置的CSS類指定顏色：

_userName.css("border-color", "") 

Answer 3

我建議創建一個名爲錯誤一種新的風格類和應用它的文本時，該字段包含錯誤。代碼片段：

CSS：.error{border-color:#F00;}

 if (_userName.val().trim() == "") { 
      errMsg += "\nUserName is a mandatory field."; 
      $("#textboxid").addClass("error"); 
     } 
     else { 
      _userName.css('border-color', 'red');//Set border-color as loaded 
      $("#textboxid").removeClass("error"); 
     } 

優勢：如果現場沒有任何錯誤，我們就可以刪除錯誤類和文本框的外觀和感覺會回到原來的風格。不需要明確跟蹤原始邊框顏色。樣式規則也可以重複使用！ ;-)

Answer 4

要在頁面加載時設置顏色，您可以執行以下操作。

$(function(){ 
    $('#ID for _userName').css('border-color', color); 
}); 

對於邊框的顏色與所有其他告知，但它應該是在表單提交。

<form ... onSubmit="ValidateUser(this)"> 
... Your form elements ... 
</form> 

而且你的JS是這樣的

function ValidateUser(frmObj){ 

    if (frmObj._userName.value.trim() == "") { 
      errMsg += "\nUserName is a mandatory field."; 
      $('#ID for _userName').css('border-color', color); 
     } 
     else { 
      $('#ID for _userName').css('border-color', ''); 
     } 
} 

我還會建議創建一個類相同的相同的邏輯像威拉解釋和使用的。