使用jQuery並試圖用css更改錯誤消息

Question

我有一個表單，我想更改CSS中的錯誤消息的字體大小和顏色，但我無法弄清楚如何做到這一點。

$(document).ready(function() { 
    $("#form1").validate({ 
     rules: { 
     credit: { 
     required:true, 
     creditcard: true 
     }, 
     amount: { 
     required: true, 
     min:(15), 
     }, 
     firstname: "required",// simple rule, converted to {required:true} 
     surname: "required",// simple rule, converted to {required:true} 
     name2: "required",// simple rule, converted to {required:true}  
     surname2: "required",// simple rule, converted to {required:true}  
     name3: "required",// simple rule, converted to {required:true} 
    }, 

這些消息，我不希望他們是相同的大小和顏色的形式輸入，需要弄清楚如何改變它們

 messages: { 
     firstname: "Please enter a first name", 
     surname: "Please enter a surname", 
     name2: "Please enter a first name", 
     surname2: "Please enter a surname", 
     name3: "Please enter a name", 
     }  
    }); 
}); 

Answer 1

默認使用jQuery的驗證插件，當您嘗試發佈帶有錯誤的表單時，它會將類名error添加到驗證失敗的所有表單元素。所以：

<input type="text" name="firstname"/> 

將變爲：

<input type="text" name="firstname" class="error"/> 

要改變風格，使用這樣的：

.error { 
    color: red; 
    font-size: 12px; 
}