在使用HappyJs進行驗證時更改文本框邊框顏色

我試圖在驗證啓用時在表單上獲取文本框邊框顏色。我現在有一個風格建立在CSS：在使用HappyJs進行驗證時更改文本框邊框顏色

input[type=text]:focus { 
    box-shadow: 0px 0px 7px #0dc8e5; 
} 

input[type=text]:hover { 
    box-shadow: 0px 0px 7px #0dc8e5; 
}

然而，這需要如果javascript驗證踢

我用下面的方法修改爲紅色：HappyJs。

來源

2014-03-07 Josh Thompson-Smith

什麼需要改變爲紅色？驗證功能如何顯示？ – Morne

如果您查看鏈接提供; '步驟2'是函數的外觀。 –

那麼，如果驗證失敗，您是否希望文本輸入爲紅色？ – Morne

使用happy.js時，如果字段驗證更改，則會添加「不快樂」類。所以你可以添加以下到您的CSS

.unhappy{ 
    border-color:red; 
    border-width:1px; 
    border-style:solid; 
}

來源

2014-03-07 11:51:48 Morne

我已經編輯我的班級添加邊框，而不是背景顏色 – Morne

謝謝！簡直不敢相信它是如此簡單。：d –

發生錯誤後，您需要爲使用jquery的特定輸入設置類。

一個簡單的例子：

$("#register").validate({ 
          debug: true, 
          errorClass:'error help-inline', 
          validClass:'success', 
          errorElement:'span', 
          highlight: function (element, errorClass, validClass) { 
          $(element).parents("div.control-group").addClass(errorClass).removeClass(validClass); 

          }, 
          unhighlight: function (element, errorClass, validClass) { 
            $(element).parents(".error").removeClass(errorClass).addClass(validClass); 
          },

現在你可以風格你的CSS類的幫助下，內嵌紅色邊框/陰影。

來源

2014-03-07 11:38:27

在使用HappyJs進行驗證時更改文本框邊框顏色

回答

相關問題