<!DOCTYPE html> <html lang="en"> <script src="jquery-1.8.3.min.js"></script> <head> <meta charset="UTF-8"> <title>切换背景图</title> <style> .check { text-align: right; font-size: 24px; height: 50px; width: 150px; background: url(agree.png) left center no-repeat; } .checkbox { width: 50px; height: 50px; vertical-align: middle; filter: alpha(opacity=0); -moz-opacity: 0; -khtml-opacity: 0; /*opacity: 0; */ } label { vertical-align: middle; } </style> </head> <body> <div class="check"> <input id="checkbox1" class="checkbox" type="checkbox" checked="checked" /><label>记住密码</label> </div> </body> </html> <script> $(document).ready(function() { var flag = 1; $(".check").click(function() { if (flag == 1) { $(".check").css("background", "url(agrees.png) left center no-repeat"); flag = 0; } else { $(".check").css("background", "url(agree.png) left center no-repeat"); flag = 1; } }) }); </script>
