公開非公開單選
阿新 • • 發佈:2018-12-10
<!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8" /> <style> .checkbox>div{ display: inline-block } .checkitem{ margin-left: 6px; } .checkitem>b{ display: inline-block; width: 20px;height: 20px; background: url(checkno.png)no-repeat; vertical-align: middle; cursor: pointer; } .checkitem>b.active{ background: url(checkyes.png)no-repeat; } .checkitem>span{ margin-left: 6px; vertical-align: middle; } </style> </head> <body> <div class="checkbox"> <div class="checkitem"><b shareFlag="-1"></b><span>公開</span></div> <div class="checkitem"><b shareFlag="3"></b><span>非公開</span></div> </div> <script src="jquery.min.js"></script> <script> $(function(){ $(".checkbox").on("click","b",function(){ var sd = $(this).attr("shareFlag"); $(this).addClass("active").parent().siblings().find("b").removeClass("active"); }) }) </script> </body> </html>
圖示:
效果: