input checkbox问题和li里面包含checkbox
<input type="checkbox" id="checkbox1"/>
$("input#checkbox1").click(function() {
console.log($(this).attr('checked'));
console.log($(this).prop("checked"));
});
点击checkbox输出:
<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>
js如下:
$("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不行。原因在于你勾选后,input.prop("checked")就为真了,这时就又取消掉了。导致你勾选不上。
这么做也不行:
$("ul li").click(function(){
var $input=$(this).find("input");
var count=1; if(count%2==0)
{
$input.prop("checked",false);
$(this).css("background-color",""); }
else
{
$input.prop("checked",true);
$(this).css("background","red"); }
count++;
});
因为每次点击count都重新赋值。
这里可以用each来在每个li函数定义之前加count:
$("ul li").each(function(){
var count=1;
$(this).click(function(){
var $input=$(this).find("input");
if(count%2==0)
{
$input.prop("checked",false);
$(this).css("background-color",""); }
else
{
$input.prop("checked",true);
$(this).css("background","red"); }
count++;
});
});
input checkbox问题和li里面包含checkbox的更多相关文章
- js做全选,用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false
用一个checkbox复选框做多个checkbox复选框的全选按钮,有一个复选框未被选择时,全选按钮的checked就为false,当所有checkbox都被选中时,全选按钮也被选中. 详解: 有两种 ...
- jquery選取所有checkbox和判斷是否全部checkbox已經被勾選
前言 勾選/取消勾選 全部勾選checkbox的時候 勾選/取消勾選 所有對應的checkbox 當所有對應checkbox有別勾選的時候, 全部勾選checkbox 也要被勾選 完整程式碼範例 前言 ...
- freemarker中修改和添加功能中包含checkbox复选框默认选中需求的解决方式
今天做的公司ERP系统上线第一天内部使用的,各种BUG铺天盖地,[虽然只是技术总监一个人在测试……],其中有一个就是其中部门管理页面中的修改和添加功能 一个人做一套ERP总是有点疏漏的,虽然里面的东西 ...
- li标签和checkbox绑定
参考原文:https://www.cnblogs.com/youxin/p/3885496.html 我们经常需要li或span包含一个checkbox,不管点击checkbox或li都会触发相应的事 ...
- 同上! 下拉复选框 点击当前的checkbox 选中后面li 添加到指定区域
(function() { $(".cxbtntj").click(function(){ console.log($("#jsLi1").attr(" ...
- jquery--获取input checkbox是否被选中以及渲染checkbox选中状态
jquery获取checkbox是否被选中 html <div><input type="checkbox" id="is_delete" n ...
- [置顶]
android ListView包含Checkbox滑动时状态改变
题外话: 在xamarin android的开发中基本上所有人都会遇到这个小小的坎,的确有点麻烦,当时我也折腾了好一半天,如果你能看到这篇博客,说明你和我当初也是一样的焦灼,如果你想解决掉这个小小的坎 ...
- [WPF 自定义控件]创建包含CheckBox的ListBoxItem
1. 前言 Xceed wpftoolkit提供了一个CheckListBox,效果如下: 不过它用起来不怎么样,与其这样还不如参考UWP的ListView实现,而且动画效果也很好看: 它的样式如下: ...
- 在ASP.NET MVC中验证checkbox 必须选中 (Validation of required checkbox in Asp.Net MVC)
转载自 http://blog.degree.no/2012/03/validation-of-required-checkbox-in-asp-net-mvc/ Why would you want ...
随机推荐
- Decorator设计模式浅谈
装饰类跟基础组件都实现了目标接口,是为了匹配正确的类型.Java中的IO设计就是典型的Decorator设计模式. 装饰模式产生的初衷是, 对默认实现类的行为进行扩展. 由于装饰类的构造器接受的参数是 ...
- Mysql_存储功能
先上一段代码: -->DELIMETER; ----加上这一句:DELIMETER的作用是设定客户机的分隔符,表示用//包含的是一段程序,一起执行,而不是见到“:”就执行 结束的时候写上 ...
- ios 获取字符串所需要占用的label的高度
// 设置字体大小 UIFont *fnt=[UIFont systemFontOfSize:16]; NSDictionary *attribute = @{NSFontAttributeNa ...
- 关于XML与类型Class的映射
我们知道数据的持久化是编程必须面对的问题.我们可以保存数据到数据库.Excel表.XML文件.TXT文件等等.那么我们编程中经常会遇到对Xml文件的操作.在http://www.cnblogs.com ...
- JavaScript中事件绑定的方法总结
最近收集了一些关于JavaScript绑定事件的方法,汇总了一下,不全面,但是,希望便于以后自己查看. JavaScript中绑定事件的方法主要有三种: 1 在DOM元素中直接绑定 2 JavaScr ...
- [xUnit]尝试单元测试
参考: http://xunit.github.io/ http://shouldly.readthedocs.org/en/latest/ 创建测试项目工程,类型选择类库,在NuGet中搜索xuni ...
- List分页显示
//对List集合 数据进行分页 int pageNum = page.getPageNo();// 当前显示第几页 int perPageNum = page.getPageSize(); // ...
- [cocos2d-x 2.0.4][iOS7]不能全屏问题
本篇文章由:http://www.sollyu.com/cocos2d-x-2-0-4-ios7-cannot-be-full-screen-problem/ 说明 ▼ 症状如下图 解决 打开你工程的 ...
- KMP的模版实现(以hdu1711为例)
贴代码,觉得带template的有一些大材小用……不过还是按自己风格写吧! /************************************************************* ...
- 细说 ASP.NET Cache 及其高级用法
许多做过程序性能优化的人,或者关注过程程序性能的人,应该都使用过各类缓存技术. 而我今天所说的Cache是专指ASP.NET的Cache,我们可以使用HttpRuntime.Cache访问到的那个Ca ...