Code for beautifying the checkbox and radio controls using jquery and images (package and download)

:
 
HTML:
Copy codeThe Code is as follows:
<Div id = "chklist" style = "padding: 10px; font-size: 14px;">
<Input type = "checkbox" value = '1'/> <label> aaaaaa </label>
<Input type = "checkbox" value = '2'/> <label> bbbbbb </label>
<Input type = "checkbox" value = '3'/> <label> ccccc </label>
<Input type = "checkbox" value = '4'/> <label> ddddd </label>
</Div>
<Div id = "radiolist" style = "padding: 10px; font-size: 14px;">
<Input name = 'R' type = "radio" value = '11'/> <label> AAAAAA </label>
<Input name = 'R' type = "radio" value = '21'/> <label> BBBBBBBB </label>
<Input name = 'R' type = "radio" value = '31'/> <label> CCCCCC </label>
<Input name = 'r'type = "radio" value = '41'/> <label> DDDDDD </label>
</Div>


JS:
Copy codeThe Code is as follows:
$ (Function (){
$ ('# Chklist'). hcheckbox ();
$ ('# Radiolist'). hradio ();
$ ('# BtnOK'). click (function (){
Var checkedValues = new Array ();
$ ('# Chklist: checkbox'). each (function (){
If ($ (this). is (': checked '))
{
CheckedValues. push ($ (this). val ());
}
});
Alert (checkedValues. join (','));
Alert ($ ('# radiolist: checked'). val ());
})
});

It is required to introduce jquery files.
There is also a checkbox plug-in JS file jquery-hcheckbox.js, In the download of the compressed package has the source file and DEMO
Please let me know if you have made more beautiful on this basis ~~
Demo address http://demo.jb51.net/js/jQuery_HCheckbox/index.html
Package