- 浏览: 2288416 次
- 性别:
- 来自: 成都
文章分类
- 全部博客 (357)
- J2EE (49)
- JavaScript (40)
- Spring (19)
- Struts (5)
- CSS (8)
- Hibernate (16)
- Java (67)
- DWR (4)
- JSON (3)
- XFIRE (1)
- Tomcat (1)
- Ant (2)
- 设计模式 (2)
- 经典收藏 (2)
- JSP (10)
- Linux (0)
- WebLogic (11)
- myeclipse (13)
- Buffalo (4)
- 文件上传相关 (1)
- oracle (33)
- html (6)
- JSTL (3)
- SVN (2)
- GIT (1)
- 孙卫琴(Java网络编程精解) (1)
- DOM4J (2)
- Swing (1)
- AJAX (1)
- Eclipse (5)
- 日志组件 (3)
- PowerDesigner (1)
- Jquery (22)
- IT技术开发相关网址 (1)
- Nutz (1)
- 其它 (1)
- Velocity (3)
- WebService (1)
- MySql (2)
- Android (1)
- Maven (2)
- Quartz (11)
- Lucene (1)
- springsource (1)
- Junit (1)
- Activiti (0)
最新评论
-
yzlseu:
拼凑,没有营养
Activiti进阶—分配组任务 -
zhangsenhao:
非常赞!代码很清楚
SpringMVC3.0+MyIbatis3.0(分页示例) -
xiamw2000:
分页写得不对,应该是 : order by ${orderNa ...
SpringMVC3.0+MyIbatis3.0(分页示例) -
sheertewtw:
...
SpringMVC:上传与下载 -
kingtoon:
...
XSS之xssprotect
业务需求:经常在用户登记中有这样的东西,只选择其中一项或者多项
页面代码
jQuery中它提供了一个方法实现
但是这个方法有局限性,它只是选取二个下标之间的元素
只有手动写了
js原生实现
说明以下来自于:jQuery权威指南代码:针对单个复选框的判断
jQuery方式
DOM方式
页面代码
<input type="checkbox" name="love" value="0"/>电影 <input type="checkbox" name="love" value="1"/>图书 <input type="checkbox" name="love" value="2" checked/>学习 <input type="checkbox" name="love" value="3"/>编程 <input type="button" id="get4" value="设置多选框的值" /><br>
jQuery中它提供了一个方法实现
$(":checkbox[name=love]").slice(1,2).attr("checked",true);
但是这个方法有局限性,它只是选取二个下标之间的元素
只有手动写了
var v = prompt('欢迎你,请输入值',''); var lv = v.split(','); var size = lv.length; $(':checkbox[name=love]').each(function() { this.checked = false; /* for(var i=0;i<size;i++){ if(this.value == lv[i]){ this.checked = true; } }*/ if(v.indexOf(this.value) != -1){ this.checked = true; } });
js原生实现
//js原生实现 //判断是以逗号相连 var lv = v.split(','); var size = lv.length; var loves = document.getElementsByName("love"); var leng = loves.length; for(var i=0;i<leng;i++){ //将原来设置清空 loves[i].checked = false; if(size > 0){ for(var j=0;j<size;j++){ if(loves[i].value == lv[j]){ loves[i].checked = true; break; } } }else{ if(loves[i].value == v){ loves[i].checked = true; } } }
说明以下来自于:jQuery权威指南代码:针对单个复选框的判断
<input type="checkbox" id="cr"/>
jQuery方式
var $cr = $("#cr"); //jQuery对象 $cr.click(function(){ if($cr.is(":checked")){ //jQuery方式判断 alert("感谢你的支持!你可以继续操作!"); } })
DOM方式
var $cr = $("#cr"); //jQuery对象 var cr = $cr.get(0); //DOM对象,获取 $cr[0] $cr.click(function(){ if(cr.checked){ //DOM方式判断 alert("感谢你的支持!你可以继续操作!"); } })
发表评论
-
java json-lib & jQuery & jsonp
2016-06-30 11:31 826参考链接: 1、http://hanqunfeng.iteye ... -
JavaScript异步编程学习
2016-06-19 14:59 794一 JavaScript学习资源 1、Reg Braithwa ... -
jQuery图表(jqPlot,Highcharts)
2012-05-18 00:48 23558jQuery图表在http://www.oschina.net ... -
JavaScript中的arguments,callee,caller,call,appy [备忘]
2012-05-08 23:13 1623转载:JavaScript中的argume ... -
IE,FF获取文件绝对路径方法
2012-03-25 23:30 4988参考资料 1 解决Firefox3,IE7,IE8上传图片预览 ... -
jQuery之Ztree
2011-10-19 17:14 17582参考资料 1 spring+struts2+hibernate ... -
jQuery之弹出层(用于提示)
2011-10-19 10:26 2295参考了权威指南的部分代码 实现效果:单击按钮显示层,在单击就 ... -
jQuery之get(txt,xml,json二点注意事项)
2011-10-18 14:42 5710参考资料 1 jQuery ajax - get() 方法 h ... -
jQuery之load
2011-10-17 15:33 7779参考资料 1 jQuery ajax - load() 方法 ... -
My97DatePicker常用练习
2011-09-15 17:03 5150参考官网资料:http://www.m ... -
jQuery之ID选择器
2011-08-23 15:25 9901参考资料 强烈推荐:张子秋 从零开始学习jQuery (二) ... -
jQuery之effect(效果)
2011-08-23 14:59 2609参考资料 从零开始学习jQuery (7) jQuery动画- ... -
jQuery之css
2011-08-23 13:54 1630jQuery W3C文档 http://www.w3schoo ... -
jQuery之select
2011-08-22 16:39 2357话不多说,详见代码吧 网页代码 <div style ... -
jQuery之实战(checkbox,table)
2011-08-19 16:22 3827实现功能如下:参考图片 1 页面加载时效果 2 全选效果 ... -
jQuery之table(隔行变色)
2011-08-19 15:52 2778页面代码如下: <table style=&quo ... -
jQuery之radio(单选)
2011-08-18 15:41 2461页面代码如下: <inpu ... -
jQuery之get(val,text,html)
2011-08-18 14:53 6053参考资料 1 jquery中,html、val与text三者属 ... -
jQuery之ID选择器
2011-08-18 13:58 16参考资料 强烈推荐:张子秋 从零开始学习jQuery (二) ... -
jQuery之jqzoom(图片放大镜插件)
2011-08-18 11:07 19734参考资料 1 基于jQuery开发的图片放大镜插件 - 淘宝网 ...
相关推荐
本教程将详细讲解如何利用jQuery实现一个炫酷的CheckBox复选框效果。 首先,让我们理解复选框(CheckBox)的基本概念。在HTML中,`<input type="checkbox">`用于创建一个复选框,用户可以勾选或取消勾选。然而,...
jquery 实现鼠标单击行时,改变行的背景颜色,选中checkbox复选框
这些元素通常以`<ul>`和`<li>`构成,每个`<li>`代表一个节点,其中包含了复选框`<input type="checkbox">`和节点文本。插件通过这些元素进行渲染和交互处理。 `css`文件夹包含了样式文件,用于定义树形复选框的视觉...
"Prototype与jQuery美化Checkbox复选框实例"这个压缩包文件正是针对这一需求提供的一种解决方案。下面,我们将详细探讨Prototype和jQuery库在美化Checkbox上的应用以及相关的前端知识点。 首先,Prototype是一个...
在本文中,我们将深入探讨如何使用jQuery和layui插件来创建功能丰富的checkbox复选框,包括权限范围的多选、单选以及全选操作。同时,我们也将关注于父级和子级复选框之间的联动关系,即父级选中时子级全部选中,而...
### 隐藏LayUI数据表格表头的Checkbox复选框方法详解 #### 背景介绍 在前端开发过程中,经常会使用到LayUI框架搭建网页应用,尤其是在设计复杂的数据展示界面时,LayUI提供了强大的数据表格功能。然而,在某些场景...
**jQuery 复选框组件详解** 在Web开发中,复选框(Checkbox)是一种常见的用户交互元素,用于让用户从多个选项中选择一个或多个。jQuery,作为一款强大的JavaScript库,提供了丰富的插件和方法来增强复选框的功能和...
对于jQuery自定义复选框checkbox和单选框Radiobox,我们已经有介绍过不少了,比如9款迷人样式的CSS3自定义Checkbox复选框和HTML5/CSS3开关按钮 立体3D按钮。今天要介绍的是一款基于jQuery的美化版复选框,它的特点是...
**绚丽的复选框 jQuery-Checkbox** 在网页设计中,复选框(checkbox)是常见的交互元素,用于让用户选择一个或多个选项。然而,原始的HTML复选框样式通常较为简单,缺乏吸引力。为了提升用户体验和界面美观度,...
本项目专注于使用jQuery来美化复选框(checkbox)的样式,为用户提供更加美观和定制化的界面体验。 首先,复选框是HTML中一种基本的表单元素,通常用于让用户在多个选项中进行多选。然而,浏览器默认的复选框样式...
"CheckBox复选框美化版"就是这样一个专注于提升UI美感的项目。复选框(CheckBox)是用户界面中常见的一种元素,用于让用户在多个选项中进行多选操作。在标准的HTML和CSS中,复选框的样式有限,往往难以满足设计师们...
在探讨如何使用jQuery判断复选框(checkbox)是否被选中的过程中,我们首先需要理解复选框的基本属性以及jQuery操作DOM元素的方式。复选框在HTML中被定义为`<input type="checkbox">`,当它被选中时,其`checked`属性...
本示例中,我们关注的是如何使用jQuery来实现复选框(checkbox)的全选和反选功能,这对于构建具有交互性的表单或者需要用户进行多选操作的界面是非常实用的。 在HTML中,复选框通常由`<input>`标签定义,类型为...
本示例探讨的是如何使用jQuery实现一个功能,即当用户点击复选框(checkbox)时,模仿招聘人才网站的工作地点弹出选择功能。这个功能可以提升用户体验,让用户更加便捷地筛选感兴趣的工作岗位。 首先,我们需要理解...
在网页设计中,复选框(Checkbox)是用户界面中常用的一种元素,它允许用户对多个选项进行选择或取消选择。然而,原生的HTML复选框在样式上可能较为简单,无法满足现代网页设计美观的需求。jQuery作为一个强大的...
在网页开发中,表格(Table)是常用的数据展示方式,而复选框(Checkbox)则为用户提供多选功能。在HTML的表格中实现复选框的全选与反选功能,能够大大提升用户体验,使用户可以便捷地选择一组数据。这里我们将详细...
在这个项目中,我们关注的是使用jQuery来实现一些特定的功能,这些功能包括复选框的操作(全选、反选、取消选择)以及购物车中的商品价格统计。 首先,让我们深入了解一下复选框的操作。在HTML中,复选框是通过`...
本教程主要探讨的是如何使用jQuery实现多级复选框(checkbox)的功能,包括水平横向、垂直纵向两种排列方式,并且提供了三种不同的样式供选择。通过这个项目,我们可以学习到如何用jQuery控制复选框的状态,以及如何...
在给定的压缩包"jQuery弹出框checkbox复选框多选代码.zip"中,我们可以看到两个核心文件:`index.html`和`jquery-1.9.1.min.js`。这些文件共同构成了一个简单的jQuery应用,用于实现弹出框内的多选复选框功能。 ...