<!DOCTYPE html>

<html>

    <head>

        <meta charset="UTF-8">

        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">

        <meta name="apple-mobile-web-app-capable" content="yes">

        <meta name="apple-mobile-web-app-status-bar-style" content="black">

        <meta name="description" content="aportpower"/>

        <title></title>

        <style type="text/css">

            .tubiao{

                width: 100%;

                height: 200px;

                border: 1px solid #000;

                background: #333;

            }

            .tubiao span{

                float: right;

                display: inline-block;

                width: 30px;

                height: 30px;

                margin-top: 85px;

                margin-right: 85px;

                background: url(../img/tab_collection_normal.png) no-repeat center;

                background-size: 100% 100%;

                border: 1px solid red;

            }

        </style>

    </head>

    <body>

        <div class="tubiao"><span></span></div>

        <script src="../js/lib/jquery-2.1.0.js"></script>

        <script type="text/javascript">

            var flag = 1;

            $(".tubiao span").unbind().bind('click',function(){

                if (flag) {

                    //$(this).css("background","red");

                    $(this).css({"background":"url(../img/tab_collection_light.png) no-repeat center", "background-size":"100% 100%"});

                    console.log("tab_collection_light.png");

                    flag=0;

                } else{

                    //$(this).css("background","magenta");

                    $(this).css({"background":"url(../img/tab_collection_normal.png) no-repeat center", "background-size":"100% 100%"});

                    console.log("tab_collection_normal.png");

                    flag=1;

                }

            })

        </script>

    </body>

</html>

注：图片自己添加。。。别忘了是jQuery！！！

 

点击选中/取消选中flag的更多相关文章

  1. jquery 复选框全选/全不选切换 普通DOM元素点击选中/取消选中切换

    1.要选中的复选框设置统一的name 用prop() prop() 方法设置或返回被选元素的属性和值. $("#selectAll").click(function(){ $(&q ...

  2. jquery 单击选中 再次选中取消选中

    html: <div id="full" class='weui-popup__container' style="background: #fff"&g ...

  3. zTree 节点勾选取消勾选 选中取消选中

    zTreeObj.cancelSelectedNode function 举例 取消当前所有被选中节点的选中状态 var treeObj = $.fn.zTree.getZTreeObj(" ...

  4. jQuery实现点击单选按钮切换选中状态效果

    实现效果:第一次点击单选按钮时选中该按钮,再次点击时取消选中该单选按钮. 关键就是要将单选按钮原来的值保存起来,第二次点击时.如果原来选中则取消,否则选中. 看代码吧,是用jQuery实现的,功能虽小 ...

  5. 点击div全选中再点击取消全选div里面的文字

    想做一个就是点击一个div然后实现的功能是div里面的文字都成选中状态,然后就可以利用浏览器的自带的复制功能,任意复制在哪里去了 在网上百度了一下 然后网上的答案感觉很大的范围 然后一些搜索 然后就锁 ...

  6. easyui datagrid取消点击行的选中事件

    http://www.jeasyui.com/demo/main/index.php?plugin=DataGrid&theme=material&dir=ltr&pitem= ...

  7. 【前端JS】radio 可单选可点击取消选中

    普通情况下 radio 单选框仅仅能实现多选一的效果,可是一旦选择当中一个后,这个单选框就不可点击取消其选中状态了.这样的功能在某些业务环境下并不适用.有时我们既须要单选框的多选一效果.也须要复选框的 ...

  8. tableviewcell的取消选中，高亮

    1.取消多余cell的分割线 UIView *view = [UIView new]; view.backgroundColor = [UIColor clearColor]; [tableView ...

  9. radio(单选框)反复选中与取消选中

    做个记录,以便需要拿取 <script type="text/javascript"> $(function(){ 第一种 $('input:radio').click ...

随机推荐

  1. 2016-2017 ACM Central Region of Russia Quarterfinal Programming Contest BHanoi tower

    B Hanoi tower It has become a good tradition to solve the “Hanoi tower” puzzle at programming contes ...

  2. mycat 优化

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/u014180504/article/details/76595247show @@datanode; ...

  3. OGNL表达式详解

    OGNL表达式标签中的值有三种: 1.直接是OGNL表达式. 2.字符串需转义自OGNL表达式. 1)OGNL表达式转换为字符串显示,需要用''(单引号)引起来. 2)转为OGNL表达式的字符串,需要 ...

  4. iOS学习笔记49-Swift(九)访问控制

    一.Swift的访问控制 Swift中的访问控制模型基于模块和源文件这两个概念 模块指的是Framework或App bundle.在Swift中,可以用import关键字引入自己的工程. 源文件指的 ...

  5. TensorFlow开发流程 Windows下PyCharm开发+Linux服务器运行的解决方案

    不知道是否有许多童鞋像我一样,刚开始接触TensorFlow或者其他的深度学习框架,一时间有一种手足无措的感觉. 怎么写代码?本机和服务器的关系是啥?需要在本机提前运行吗?怎么保证写的代码是对的??? ...

  6. P1023 税收与补贴问题 (模拟)

    题目链接 Solution 比较恶心的模拟题(主要是难看懂题意其实) 题意戳这里 然后根据一些简单的数学常识,可以知道这是一个二次函数. 所以我们每次枚举一个值,然后判定政府给出的价格是否是顶点即可. ...

  7. element-ui 的input组件 @keyup.enter事件的添加办法

    <el-input placeholder="请输入密码" type="password" @keyup.enter.native="login ...

  8. bzoj 1185 [HNOI2007]最小矩形覆盖 凸包+旋转卡壳

    题目大意 用最小矩形覆盖平面上所有的点 分析 有一结论:最小矩形中有一条边在凸包的边上,不然可以旋转一个角度让面积变小 简略证明 我们逆时针枚举一条边 用旋转卡壳维护此时最左,最右,最上的点 注意 注 ...

  9. llinux 定时器 转载自 http://blog.chinaunix.net/uid-11848011-id-96374.html

    这篇文章主要记录我在试图解决如何尽可能精确地在某个特定的时间间隔执行某项具体任务时的思路历程,并在后期对相关的API进行的归纳和总结,以备参考. 问题引出 很多时候,我们会有类似“每隔多长时间执行某项 ...

  10. CodeForces 380.C Sereja and Brackets

    题意 一串括号序列,只由(和)组成,然后是m个提问,提问l和r区间内,最大的匹配匹配括号数. 思路 第一,贪心的思想,用最正常的方式去尽量匹配,详细点说就是,先找到所有的(),然后删除这些(),再找所 ...