111
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title>点评标签 </title> <script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js"></script> <style> .tagClass { color: lightgray; width: 150px; height: 35px; line-height: 30px; text-align: center; border: 2px solid lightgray; margin: 3px 10px 3px 10px; float: left; font-size: 20px; cursor: pointer } .tagAddClass { color: #FF7744; border: 2px solid #FFC8B4; background-color: #FFC8B4; } </style> </head> <body> <div class="mui-input-row"> <div class="tagClass">主题鲜明</div> <div class="tagClass">学科前沿性</div> </div> <div class="mui-input-row"> <div class="tagClass">研究热点难点</div> <div class="tagClass">国家重大需求</div> </div> <script> $(function () { $(".tagClass").each(function () { tagClassClick($(this)); }) }); function tagClassClick(element) { var $tagClass = $(element); $tagClass.click(function () { if ($tagClass.hasClass('tagAddClass')) { $tagClass.removeClass('tagAddClass'); } else { $tagClass.addClass('tagAddClass'); } }); } </script> </body> </html>