如何使用JQuery在选中时突出显示一个checkobx

Question

我试图使用JQuery突出显示用户检查的复选框，
以及当用户未选中这些checkox时它们将被取消突出显示。

但是怎么可能做到这一点呢？

Answer 1

造型复选框，在每一个浏览器的不同... take a look

所以我的建议是：

1. 用span覆盖复选框。
2. 然后给跨度填充像2px或1px。
3. 然后当复选框被选中时，给它的范围一个像红色背景的样式。

Answer 2

我以前没有使用过jQueryUI Effect（）方法，但它有一个'highlight'方法。

所以我会尝试沿着这些线。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> 

$('#mycheck:checked').effect('highlight'); 

Answer 3

不知道你的 “亮点” 的意思，但在这里有云：

$(document).ready(function() { 
    $("#checkboxID").change(function() { 
    if ($(this).attr("checked")) { 
     //checkbox has been checked 
     $(this).css("border", "1px solid #ff0000"); 
    } 
    else { 
     //unchecked 
     $(this).css("border", "0"); 
    } 
    }); 
});