js简单的实现点击选中点击取消的效果

最新推荐文章于 2024-05-09 15:49:11 发布

寒江水kevin

最新推荐文章于 2024-05-09 15:49:11 发布

阅读量8.8k

点赞数 2

分类专栏： html5+css 文章标签： javascript css html5

本文链接：https://blog.csdn.net/qq_34813588/article/details/54584683

版权

html5+css 专栏收录该内容

4 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
   <head>
       <meta charset="UTF-8">
       <title></title>
       <style type="text/css">
           .square{width:100px;height:20px;border:1px solid black;margin-top: 10px;}
           .selected{background-color:red;}
       </style>
   </head>
   <body>
       <div class="square"></div>
       <div class="square"></div>
       <div class="square"></div>
       <div class="square"></div>
       <script src="js/zepto.min.js" type="text/javascript" charset="utf-8"></script>
       <script type="text/javascript">
           $(function(){
               $(".square").each(function(k,v){
                   $(v).click(function(){
                       console.log(124)
                   if(!$(v).is(".selected")){
                       $(this).addClass("selected");
                   }else{
                       $(this).removeClass("selected");
                   }
               });
               });
           });
       </script>

寒江水kevin

关注

2
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
js简单的实现点击选中点击取消的效果

.square{width:100px;height:20px;border:1px solid black;margin-top: 10px;} .selected{background-color:red;}
复制链接

扫一扫