如何，如果發現錯誤突出錶行 - Jquery的

Question

這裏是jQuery的：

$(function() { 
    $("#register-form").validate({ 
    rules: { 
     fname: "required", 
     surname: "required", 
     middlename: "required", 
     }, 
    messages: { 
     fname: "Please enter your name", 
     surname: "Please specify your surname", 
     middlename: "Please specify your surname", 

    }, 
      submitHandler: function(form) { 
     form.submit(); 
    } 

    }); 
}); 

這裏是我的HTML：

<form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]); ?>" method="post"  id="register-form"> 
<table width="614" border="0"> 
<tr style="<?php echo $errorname_css; ?>"> 
<td width="153">First Name</td> 
<td width="175"> 
    <input type="text" name="fname" value="<?php echo $fname; ?>" /></td> 
<td width="272">*<?php echo $fname_err; ?></td> 
</tr> 
<tr style="<?php echo $errorsurname_css; ?>"> 
<td>Surname</td> 
<td><input type="text" name="surname" value="<?php echo $surname; ?>" /></td> 
<td>*<?php echo $surname_err; ?></td> 
</tr> 
<tr style="<?php echo $errormidname_css; ?>"> 
<td>Middle Name</td> 
<td><input type="text" name="middlename" value="<?php echo $middlename; ?>" /></td> 
<td>*<?php echo $middlename_err; ?></td> 
</tr> 
<tr style="<?php echo $errormidname_css; ?>"> 
<td>&nbsp;</td> 
<td><input type="submit" name="submit" value="Submit" /></td> 
<td>&nbsp;</td> 
</tr> 
</table> 
</form> 

我想提出的CSS Jquery的信息裏面，但我不知道如何，有人可以幫助我嗎？真的很感激，謝謝:)

Answer 1

您可以使用hightlight/unhighlight方法

$("#register-form").validate({ 
    rules: { 
     fname: "required", 
     surname: "required", 
     middlename: "required", 
    }, 
    messages: { 
     fname: "Please enter your name", 
     surname: "Please specify your surname", 
     middlename: "Please specify your surname", 

    }, 
    highlight: function (element, errorClass, validClass) { 
     $(element).closest('tr').addClass(errorClass).removeClass(validClass); 
    }, 
    unhighlight: function (element, errorClass, validClass) { 
     $(element).closest('tr').addClass(validClass).removeClass(errorClass); 
    }, 
    submitHandler: function (form) { 
     form.submit(); 
    } 
}); 

然後

.error { 
    color: red; 
} 

演示：Fiddle