使用复选框和多个选择器更改功能
Change function with checkboxes and multiple selectors
我试图限制同时选中两种不同类型的复选框的数量。我想创建一个特定的复选框组合,然后发出警报,三个黄色和两个红色。我的问题是,警报只触发其中一个语句,而不是同时触发两个语句。我只能选中两张红色的,但可以选中任意多张黄色的。
$('input[name=redChoice], input[name=yellowChoice]').change(function() {
var cntRed = $('input[name=redChoice]:checked').length;
var cntYellow = $('input[name=yellowChoice]:checked').length;
var maxRedAllowed2 = 2;
var maxYellowAllowed3 = 3;
if (cntRed > maxRedAllowed2 && cntYellow > maxYellowAllowed3) {
$(this).prop('checked', false);
alert("Du har valt 3 stycken gula och 2 stycken röda.");
}
});
试试这个。我相信这就是你要找的。
你想要能够点击不超过2个红色和3个黄色,同时,你想要显示一个警告,如果有2个红色和3个黄色点击
$('input[name=redChoice], input[name=yellowChoice]').change(function() {
var cntRed = $('input[name=redChoice]:checked').length;
var cntYellow = $('input[name=yellowChoice]:checked').length;
var maxRedAllowed2 = 2;
var maxYellowAllowed3 = 3;
if (cntRed == maxRedAllowed2 && cntYellow == maxYellowAllowed3) {
//$(this).prop('checked', false);
alert("Du har valt 3 stycken gula och 2 stycken röda.");
}
else if (cntRed > maxRedAllowed2){
$(this).prop('checked', false);
}
else if (cntYellow > maxYellowAllowed3){
$(this).prop('checked', false);
}
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
red<input type="checkbox" name="redChoice"/>
red<input type="checkbox" name="redChoice"/>
red<input type="checkbox" name="redChoice"/>
red<input type="checkbox" name="redChoice"/>
yellow<input type="checkbox" name="yellowChoice"/>
yellow<input type="checkbox" name="yellowChoice"/>
yellow<input type="checkbox" name="yellowChoice"/>
yellow<input type="checkbox" name="yellowChoice"/>
yellow<input type="checkbox" name="yellowChoice"/>
相关文章:
- 每当您在选择器内移动鼠标时,悬停功能就会重复
- 每当选择器被触发时,触发功能
- 如何使用下拉菜单修复jquery日期选择器日期计算功能
- 流星是否提供时间选择器功能
- 为什么简单的点击功能找不到选择器
- D3.js键功能在简单的选择器/数组组合上运行两次
- JQuery 日期选择器功能不起作用
- j查询错误选择器上的点击功能
- 具有时区选择功能的 AngularJS 日期选择器
- jQuery选择器单击功能说明
- 如何在jquery日期选择器中禁用日期和天数.但这两种功能不能同时工作
- 在JQuery日期选择器中再添加一个事件当前添加功能不起作用
- Chrome/Firefox中双美元符号选择器查询功能的来源是什么
- 使用复选框和多个选择器更改功能
- 即使选择器被移除,Jquery的点击功能也会继续工作
- 启动日期选择器关闭功能
- JQuery选择器与许多功能不能正常工作
- 设置HTML日期选择器与Javascript功能
- Jquery时间选择器设置时间点击功能
- 拖放功能不允许所需的选择器