选择3个后可以看到效果
<script>
function disableCheckBox() {
var obj=document.getElementsByTagName("input")
for(var i=0;i<obj.length;i++)
{
if ( !obj[i].checked )
obj[i].disabled = true;
}
}
function ableCheckBox() {
var obj=document.getElementsByTagName("input")
for(var i=0;i<obj.length;i++)
obj[i].disabled = false;
}
function check()
{
var obj=document.getElementsByTagName("input")
var sun=0;
for(var i=0;i<obj.length;i++)
{
if(obj[i].type=="checkbox" &&
obj[i].checked)
sun++;
if( sun< 3 )
{
ableCheckBox();
//break;
}
else if(sun == 3 )
{
disableCheckBox();
event.srcElement.checked=true;
break;
}
else if(sun > 3 )
{
event.srcElement.checked=false;
break;
}
}
}
</script>
<input type='checkbox' name='cate[]'
value='102' onclick="check();">粤菜 <input
type='checkbox' name='cate[]' value='103'
onclick="check();">潮州 <input
type='checkbox' name='cate[]' value='104'
onclick="check();">客家 <input
type='checkbox' name='cate[]' value='105'
onclick="check();">川菜 <input
type='checkbox' name='cate[]' value='106'
onclick="check();">上海/江浙 <input
type='checkbox' name='cate[]' value='107'
onclick="check();">湖南 <input
type='checkbox' name='cate[]' value='108'
onclick="check();">湖北 <input
type='checkbox' name='cate[]' value='109'
onclick="check();">贵州 <input
type='checkbox' name='cate[]' value='110'
onclick="check();">东北 <input
type='checkbox' name='cate[]' value='111'
onclick="check();">江西 <input
type='checkbox' name='cate[]' value='112'
onclick="check();">北京 <input
type='checkbox' name='cate[]' value='113'
onclick="check();">鲁菜 <input
type='checkbox' name='cate[]' value='114'
onclick="check();">台湾 <input
type='checkbox' name='cate[]' value='115'
onclick="check();">新疆/清真 <input
type='checkbox' name='cate[]' value='116'
onclick="check();">云南 <input
type='checkbox' name='cate[]' value='117'
onclick="check();">其他中餐 <input
type='checkbox' name='cate[]' value='118'
onclick="check();">野味 <input
type='checkbox' name='cate[]' value='119'
onclick="check();">火锅 <input
type='checkbox' name='cate[]' value='120'
onclick="check();">海鲜 <input
type='checkbox' name='cate[]' value='121'
onclick="check();">比萨 <input
type='checkbox' name='cate[]' value='122'
onclick="check();">自助餐 <input
type='checkbox' name='cate[]' value='123'
onclick="check();">茶餐厅 <input
type='checkbox' name='cate[]' value='124'
onclick="check();">小吃面食 <input
type='checkbox' name='cate[]' value='125'
onclick="check();">烧烤 <input
type='checkbox' name='cate[]' value='126'
onclick="check();">素菜 <input
type='checkbox' name='cate[]' value='127'
onclick="check();">简餐 <input
type='checkbox' name='cate[]' value='128'
onclick="check();">快餐 <input
type='checkbox' name='cate[]' value='129'
onclick="check();">面包糕点 <input
type='checkbox' name='cate[]' value='130'
onclick="check();">甜品 <input
type='checkbox' name='cate[]' value='131'
onclick="check();">茶室 <input
type='checkbox' name='cate[]' value='132'
onclick="check();">咖啡厅 <input
type='checkbox' name='cate[]' value='133'
onclick="check();">酒吧 <input
type='checkbox' name='cate[]' value='134'
onclick="check();">日本 <input
type='checkbox' name='cate[]' value='135'
onclick="check();">韩国 <input
type='checkbox' name='cate[]' value='136'
onclick="check();">东南亚印 <input
type='checkbox' name='cate[]' value='137'
onclick="check();">法国 <input
type='checkbox' name='cate[]' value='138'
onclick="check();">意大利 <input
type='checkbox' name='cate[]' value='139'
onclick="check();">拉美 <input
type='checkbox' name='cate[]' value='140'
onclick="check();">无国界 <input
type='checkbox' name='cate[]' value='141'
onclick="check();">西餐 <input
type='checkbox' name='cate[]' value='142'
onclick="check();">其他西餐
分享到:
相关推荐
在网页开发中,Checkbox元素是不可或缺的一部分,它允许用户进行多选操作,常用于表单提交或者数据筛选。而`checkbox.js`文件就是专门针对这种元素进行操作的一个JavaScript库,它提供了全选、全不选以及统计选中个...
本篇文章将详细讲解如何在jQuery中实现一个复选框功能,当用户选择达到三个后,不允许再进行选择,即限制最多只能选中三个复选框。 首先,我们需要在HTML中设置好复选框。每个复选框通常有一个`<input>`标签,类型...
在Web开发中,常常需要实现用户对一系列选项进行多选的功能,而为了方便用户的操作体验,通常会提供一个“全选”或“全不选”的按钮来帮助用户快速选择或取消所有选项。本文将通过分析提供的JavaScript源代码,详细...
6.3 被选中的列表项下次不能再选 6.4 不带滚动条的select 6.5 从一个下拉列表往另一个下拉列表添加内容 6.6 改变列表项的上下顺序 6.7 给下拉框数据分组 6.8 获取列表框的选择 6.9 类IE下拉框 6.10 下拉框式邮件发送...
6.3 被选中的列表项下次不能再选 6.4 不带滚动条的select 6.5 从一个下拉列表往另一个下拉列表添加内容 6.6 改变列表项的上下顺序 6.7 给下拉框数据分组 6.8 获取列表框的选择 6.9 类IE下拉框 6.10 下拉框式邮件发送...
在上述代码中,`$(":checkbox[name="+name+"]")`是一个基于属性的选择器,它会找到所有具有指定name属性的复选框。`name`变量是触发全选/全不选操作的复选框的name属性,例如`aAll`或`bAll`。 `chkAll`函数是实现...
### 常用JavaScript Function知识点解析 #### 一、`mhHover` 函数 **功能说明**:该函数实现了一个简单的鼠标悬停效果,当鼠标悬停在指定表格的特定单元格上时,会改变该单元格的CSS类名。 **参数说明**: - `tbl`...
在网页表单设计中,有时我们需要对用户的选择行为进行限制,比如限制用户最多只能选择一定数量的选项。本文将深入解析如何使用JavaScript(js)来限制用户在复选框(checkbox)中勾选的个数,以及如何在后端使用PHP...
12. **函数定义**:函数是可重用的代码块。定义一个函数的基本语法是: ```javascript function functionName(parameters) { // 函数体 } ``` 13. **表单操作**:可以通过 `document.forms[index]` 来访问表单...
在网页开发中,jQuery是一个非常常用的JavaScript库,它简化了DOM操作、事件处理以及动画创建。...这个功能通常用于多选列表...在开发过程中,记得时刻关注代码的可维护性和可扩展性,以便在未来的需求变更中能快速适应。
JavaScript,也被称为JS,是一种广泛应用于网页和网络应用开发的脚本语言,它主要负责客户端的交互和动态效果。在JavaScript中,函数是代码的可重用块...了解和掌握这些基础知识对于编写高效的JavaScript代码至关重要。
在日常开发中,JavaScript 函数是不可或缺的一部分,它们为开发者提供了强大的功能,用于处理各种任务和实现复杂逻辑。以下是从给定文件中提炼出的关键JavaScript函数和概念,旨在帮助读者深入理解并熟练应用这些...
在“bootstrap TreeView全选单选,定位选触发事件实例”中,我们将深入探讨如何实现这个组件的多种选择功能,包括单选、全选以及通过父节点控制子节点的选择,并讨论当选择状态改变时如何触发相关事件。 1. **全选...
ASP.NET购物车代码是用于构建在线电子商务网站的关键组件,它允许用户选择商品并保存到虚拟购物车中,以便后续结账。...这些细节虽然没有在提供的代码片段中展示,但在实际应用中是不可或缺的部分。
JavaScript实现的购物车功能是电子商务网站中不可或缺的一部分,它提供了用户友好的交互体验。在本文中,我们将探讨如何使用JavaScript来实现类似淘宝购物车的各种功能,包括商品的单选、全选、删除、修改数量以及...
在小程序开发中,它们是构建用户界面时不可或缺的部分。 Radio Button和CheckBox在用户界面设计中扮演着重要角色。Radio Button用于提供一组互斥选项,用户只能选择其中的一个;而CheckBox则允许用户选择一个或多个...
总的来说,JavaScript的表单处理能力强大,不仅可以控制表单的行为,还能进行数据验证、用户交互优化等,是构建动态网页不可或缺的一部分。正确理解和使用这些概念可以极大地提升网页的用户体验。
13. **checkbox**:创建复选框,用户可以选择一个或多个选项,适合用于多选题。 14. **radio**:创建单选按钮,用户只能选择其中一个选项,常用于性别选择或等级选择等场景。 每种输入类型都有其特定的用途和验证...