在同一复选框上使用 2 个不同的脚本
Using 2 different scripts on the same checkbox
所以我尝试使用以下脚本:
//Limit of checked checkboxes
function checkboxlimit(checkgroup, limit){
var checkgroup=checkgroup
var limit=limit
for (var i=0; i<checkgroup.length; i++){
checkgroup[i].onclick=function(){
var checkedcount=0
for (var i=0; i<checkgroup.length; i++)
checkedcount+=(checkgroup[i].checked)? 1 : 0
if (checkedcount>limit){
alert("You can only select a maximum of "+limit+" checkboxes")
this.checked=false
}
}
}
}
//change bg color if checked
var seleccionado=new Array()
function cambia(fila){
if(seleccionado[fila]!=true)
{
document.getElementById("fila"+fila).style.background='#A5FA9B';
document.getElementById("fila"+fila).style.color='#FFFFFF';
seleccionado[fila]=true;
}
else
{
document.getElementById("fila"+fila).style.background='#FFF3D6';
document.getElementById("fila"+fila).style.color='#000000';
seleccionado[fila]=false;
}
}
因此,第一个函数将限制您可以选择的复选框数量,第二个函数将在选中后更改单元格背景的颜色。HTML 将是这样的:
<form id="main" name="main" method="POST">
<font face="verdana">
<table>
<tr >
<td id="fila1">FIRST<input name="ckb" onclick="cambia(1)" type="checkbox"/></td>
<td id="fila2">SECOND<input name="ckb" onclick="cambia(2)" type="checkbox"/></td>
<td id="fila3">THIRD<input name="ckb" onclick="cambia(3)" type="checkbox"/></td>
</table>
</font>
</form>
最后必须添加下一个脚本:
<script type="text/javascript">
checkboxlimit(document.forms.main.ckb, 1);
</script>
现在,它们都可以完美地单独工作,但是当我将它们组合在一起时,只有限制复选框数量的那个有效。有没有办法让它们一起工作?
问题是当你调用checkboxlimit
时,它会覆盖这些元素上的点击处理程序。您可能想要做的是从检查复选框数量的函数中调用cambia
:
function checkboxlimit(checkgroup, limit){
var checkgroup=checkgroup
var limit=limit
for (var i=0; i<checkgroup.length; i++) {
var fila = i + 1;
checkgroup[i].onclick=(function(fila){
return function () {
var checkedcount=0
for (var i=0; i<checkgroup.length; i++)
checkedcount+=(checkgroup[i].checked)? 1 : 0
if (checkedcount>limit){
alert("You can only select a maximum of "+limit+" checkboxes")
this.checked=false
} else {
cambia(fila);
}
}
}(fila));
}
}
这是假设您只想在支票有效的情况下调用cambia
。摆弄 http://jsfiddle.net/ultranaut/HN3Db/。
此外,如果还不清楚,您可以删除 html 中的 onclick
属性,因为它们无论如何都会被覆盖。
为什么你必须制作两个单独的函数?您只能调用一个函数并尝试在其中放置一个参数。
相关文章:
- 如何创建php函数或任何脚本/jquery Javascript,使我能够获取与复选框关联的值并添加它们
- Rad网格编辑模式通过选中复选框时的java脚本启用禁用所需的字段验证器
- 应用程序脚本-拆分谷歌表单复选框用逗号回答
- 如何在呈现页面后使用 Java 脚本检测 dom 元素值的值是否有任何变化(例如,任何输入或复选框值更改)
- 脚本选择所有输入,而不仅仅是复选框
- 当通过选择页面上所有复选框的 jQuery 脚本选中复选框时,如何触发自定义 javascript 事件
- 如何通过jquery/ajax将复选框数据作为数组发送到php脚本
- 编写脚本以在提交之前将复选框值连接到字符串中
- JQuery脚本未正确选中复选框
- 用于“全选”复选框的脚本在WordPress页面上不起作用
- jQuery - 基于复选框禁用 href - 脚本的位置
- 在同一复选框上使用 2 个不同的脚本
- 复选框提醒脚本在动态加载测试时不记得复选框状态.php其中包含复选框
- 编辑脚本以包括订单总计复选框
- 允许在复选框限制脚本中进行最小选择
- 使用脚本之前复选框不起作用
- 输入到选项卡脚本不会传递复选框
- 在实际设置checked标志之前,运行脚本onclick的复选框
- 使用 Java 脚本后无法取消选中复选框
- 动态添加复选框时,组中一个复选框选择的 JQuery 脚本不起作用