`
- 浏览:
164219 次
- 性别:
- 来自:
武汉
-
-
<!DOCTYPE html PUBLIC
"-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
-
<html xmlns="http://www.w3.org/1999/xhtml"
>
-
<head>
-
<meta http-equiv="Content-Type"
content=
"text/html; charset=gb2312"
/>
-
<title>louis-blog >> jQuery 对checkbox的操作</title>
-
<script type='text/javascript'
src=
"../jquery.js"
></script>
-
<SCRIPT LANGUAGE="JavaScript"
>
-
<!--
-
$("document"
).ready(function(){
-
$("#btn1"
).click(function(){
-
$("[name='checkbox']"
).attr(
"checked"
,
'true'
);
-
})
-
$("#btn2"
).click(function(){
-
$("[name='checkbox']"
).removeAttr(
"checked"
);
-
})
-
$("#btn3"
).click(function(){
-
$("[name='checkbox']:even"
).attr(
"checked"
,
'true'
);
-
})
-
$("#btn4"
).click(function(){
-
$("[name='checkbox']"
).each(function(){
-
if
($(
this
).attr(
"checked"
)){
-
$(this
).removeAttr(
"checked"
);
-
}
-
else
{
-
$(this
).attr(
"checked"
,
'true'
);
-
}
-
})
-
})
-
$("#btn5"
).click(function(){
-
var str=""
;
-
$("[name='checkbox'][checked]"
).each(function(){
-
str+=$(this
).val()+
"\r\n"
;
-
-
})
-
alert(str);
-
})
-
})
-
-->
-
</SCRIPT>
-
</HEAD>
-
<body style="text-align:center;margin: 0 auto;font-size: 12px;"
>
-
<div style="border: 1px solid #999; width: 500px; padding: 15px; background: #eee; margin-top: 150px;"
>
-
<form name="form1"
method=
"post"
action=
""
>
-
<input type="button"
id=
"btn1"
value=
"全选"
>
-
<input type="button"
id=
"btn2"
value=
"取消全选"
>
-
<input type="button"
id=
"btn3"
value=
"选中所有奇数"
>
-
<input type="button"
id=
"btn4"
value=
"反选"
>
-
<input type="button"
id=
"btn5"
value=
"获得选中的所有值"
>
-
<br><br>
-
<input type="checkbox"
name=
"checkbox"
value=
"checkbox1"
>
-
checkbox1
-
<input type="checkbox"
name=
"checkbox"
value=
"checkbox2"
>
-
checkbox2
-
<input type="checkbox"
name=
"checkbox"
value=
"checkbox3"
>
-
checkbox3
-
<input type="checkbox"
name=
"checkbox"
value=
"checkbox4"
>
-
checkbox4
-
<input type="checkbox"
name=
"checkbox"
value=
"checkbox5"
>
-
checkbox5
-
<input type="checkbox"
name=
"checkbox"
value=
"checkbox6"
>
-
checkbox6
-
</form>
-
</div>
-
</body>
-
</HTML>
分享到：
相关推荐
本文将深入探讨如何使用jQuery来实现复选框（checkbox）的选中和取消选中功能，以及如何处理多选的情况。 首先，我们需要理解HTML中的`<input>`元素类型为"checkbox"的基本用法。复选框用于让用户从多个选项中选择...
对于“jQuery的checkbox样式”，这是一个关注于提升网页中复选框（checkbox）视觉效果的主题。在这个场景中，我们讨论的是一个基于jQuery的插件，它专门用于美化标准HTML复选框的样式。 该插件的名称可能为“jQuery...
《jQuery Checkbox Tree Editor v1.0：构建动态交互的树形复选框编辑器》 在Web开发领域，用户界面的交互性和易用性是提升用户体验的关键因素之一。jQuery作为一个强大的JavaScript库，提供了丰富的功能来简化DOM...
本文将详细讲解如何使用jQuery来操作checkbox，并实现全选、全不选、反选以及获取选中值这四个核心功能。 ### 一、jQuery选择器与checkbox操作 在jQuery中，我们可以使用不同的选择器来选取页面上的checkbox元素。...
《jQuery Checkbox列表双向选择移动代码详解》 在Web开发中，jQuery库因其简洁的API和强大的功能而广受欢迎。在日常应用中，我们经常需要处理复选框（Checkbox）的选择和移动，例如在列表中实现从一个区域选择并移...
《jQuery实现Checkbox列表双向选择移动详解》 在Web开发中，用户交互的界面设计往往需要具备灵活多变的功能，以提升用户体验。其中，双向选择列表是常见的一种交互方式，允许用户在两个列表之间自由移动选中项。...
**绚丽的复选框 jQuery-Checkbox** 在网页设计中，复选框（checkbox）是常见的交互元素，用于让用户选择一个或多个选项。然而，原始的HTML复选框样式通常较为简单，缺乏吸引力。为了提升用户体验和界面美观度，...
本篇文章将深入探讨如何使用jQuery来操作checkbox和radio元素，这两种元素在表单提交和用户交互中扮演着重要角色。 首先，让我们了解checkbox和radio的基本概念。Checkbox用于提供多选选项，用户可以勾选多个选项；...
jQuery的高性能TreeView源码(带CheckBox) 1：支持静态的树，即一次性将全部数据加载到客户端。 2：异步树，即一次只加载一级或若干级节点，子节点可以异步加载数据。 3：Checkbox树（可能是静态树也可能是异步树...
本文将详细探讨如何使用jQuery对checkbox进行操作，这些操作包括选择、取消选择、检查状态以及实现更复杂的交互效果。 一、jQuery选择checkbox 在jQuery中，我们可以使用不同的选择器来选取checkbox元素。例如，`$...
在网页开发中，jQuery 是一个广泛使用的 JavaScript 库，它简化了 DOM 操作、事件处理以及Ajax交互等任务。在涉及到表单元素如复选框（Checkbox）时，经常需要实现全选、反选和全不选的功能。下面将详细探讨 jQuery ...
JQuery 判断checkbox是否选中，checkbox全选，获取checkbox选中值
接下来，我们可以使用jQuery来监听checkbox的`click`事件，并根据其状态改变相应的列表项样式。以下是一个基础的实现： ```javascript $(document).ready(function() { $('#checkboxList input[type="checkbox"]')...
仅供学习，有兴趣可以看看，高手勿入。代码很简单的。
jquery 树形 checkbox jQuery(document).ready(function(){ jQuery(".mytree").checkboxTree({ collapsedarrow: "images/checkboxtree/img-arrow-collapsed.gif", expandedarrow: "images/checkboxtree/img-...
在本教程中，我们将深入探讨如何使用jQuery来操作checkbox元素，特别是动态生成、设置显示数量以及获取选中项等核心知识点。 首先，让我们了解checkbox的基本概念。Checkbox是HTML中的一个表单元素，用于让用户对一...
C#.net下通jQuery实现的由CheckBox来控件CheckBoxList的全选操作，通过CheckBox来全选CheckBoxList，当有一个CheckBoxList选中时，CheckBox则被选中，且并且可以取得选中的CheckBox和CheckBoxList的value和text