参考原文:https://www.cnblogs.com/youxin/p/3885496.html

我们经常需要li或span包含一个checkbox,不管点击checkbox或li都会触发相应的事件,如背景色变色。

<ul>
<li><input type="checkbox" name="" id=""/>li1</li>
<li><input type="checkbox" name="" id=""/>li2</li>
<li><input type="checkbox" name="" id=""/>li3</li>
<li><input type="checkbox" name="" id=""/>li4</li>
</ul>
$("ul li").click(function(){
var $input=$(this).find("input");
if($input.prop("checked"))
{
$input.prop("checked",false);
$(this).css("background-color","");
}
else
{
$input.prop("checked",true);
$(this).css("background","red");
}
});

li标签和checkbox绑定的更多相关文章

  1. jQuery动态添加li标签并添加属性和绑定事件

    代码如下: <%@page import="java.util.ArrayList"%> <%@ page language="java" c ...

  2. chrome下li标签onclick事件无效

    //绑定事件 $(document).ready(function () { $("ul").children().click(function () { clickLi(this ...

  3. 给li标签添加自定义属性

    给li标签添加属性<ul> <li></li> <li></li> <li></li> <li>< ...

  4. Jquery和JS获取ul中li标签(转)

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  5. Jquery和JS获取ul中li标签

    js 获取元素下面所有的li var content=document.getElementById("content"); var items=content.getElemen ...

  6. ul+li标签制作表格

    table标签制作表格代码繁琐,且不方便后期代码维护. li标签加上css的浮动样式可以制作多种样式的表格. 代码如下: <ul id="ttttt" style=" ...

  7. li标签行内元素高度及居中

    <head> <title><title> <style type="text/css"> * { padding: 0px; ma ...

  8. li标签之间的空隙问题(转)

    原文地址:http://www.cnblogs.com/laogao/archive/2012/08/13/2636419.html css li 空隙问题   IE6/7的Bug:纵向排列的li中加 ...

  9. js会飞的li标签

    当点击左边的li标签的时候,这边的li标签飞到右边去,点击右边的li标签飞到左边来,并且有顺序 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 ...

随机推荐

  1. bzoj4390

    树上差分 感觉挺巧妙的... 每次更新就是在u,v上+1,x是lca(u,v),在x和fa[x]上-1,那么每个点的权值就是子树和,正确性yy一下就行了 不过树状数组的常数真是小,改成前缀和才快了20 ...

  2. mongoDB学习资料整理

    mongoDB入门篇 http://www.imooc.com/view/246

  3. word excel 等导出相关操作

    无插件,无com组件,利用EXCEL.WORD模板做数据导出(一) http://www.cnblogs.com/tzy080112/p/3413938.html 使用Aspose.Cells组件生成 ...

  4. tyvj 1666 城市建设【最小生成树】

    -Wall是个好东西,要不然我至死都看不出来我把(b[i]+b[j])写成了(b[i],b[j])-- 还是来自lyd的题解: (其实原来课件第一行式子写错了没有-1,然而我用sai手画了一个上去hh ...

  5. poj 3281 Dining【最大流】

    记得把牛拆掉!拆成两个点i和i'在中间连一条流量为1的边,来限制每头牛只能选一组 一般来讲是一种物品一个消费者各占一边,但是这里有两个物品,所以考虑把牛放在中间,s向所有的食物连流量为1的边,所有食物 ...

  6. Django中的cookie和session实现

    cookie from django.shortcuts import render, HttpResponse, redirect # 此装饰器的作用就是讲所有没有cookie验证的页面都需要验证后 ...

  7. [ZPG TEST 115] 字符串【归类思想】

    pdf效果太差,转成word效果依旧差,只好转成jpg传了. 这一题用到了“归类”的思想,令s(i, a)表示前i个字体,字符a出现的次数.那么ans一定等于一个 (  s(i, a) - s(j, ...

  8. 2016/10/29 action与form表单的结合使用

    1>web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi= ...

  9. SpringCloud开发学习总结(五)—— 服务容错保护Hystrix

    在微服务架构中,我们将系统拆分成了很多服务单元,各单元的应用间通过服务注册与订阅的方式相互依赖.但由于每个单元都在不同的进程中运行,一来通过远程调用的方式执行,这样就有可能因为网络原因或是依赖服务自身 ...

  10. 《基于Node.js实现简易聊天室系列之总结》

    前前后后完成这个聊天室的Demo花了大概一个星期,当然一个星期是仅仅指编码的工作.前期的知识储备是从0到1从无到有,花费了一定的时间熟悉Node.js的基本语法以及Node.js和mongoDB之间的 ...