JavaScript是用于页面交互的一种技术,它能控制页面元素并进行操作。下面接单的介绍checkbox的一些常用。
我们以下图为例:
用户可以对其中的记录进行修改和删除,但是修改只能选中一条记录,而删除则可以对多条记录进行。这就要用到javaScript页面交互。
以响应修改事件函数为例,代码如下:
function modify () { //遍历所有的checkbox选项 var a = document.getElementsByName("selectFlag"); var flag = 0; var index = 0; for(var i=0;i<a.length;i++){ if(a[i].checked==true){ flag++; index=i; if(flag==2) break; } } //根据遍历以后的标识符来判断是否有要修改的 if(flag==0){ alert("请选择要修改的物料!"); return; } if(flag>=2){ alert("每次修改只能选择一个物料!"); return; } with(document.getElementById("itemForm")){ method="post"; action=”item_modify.jsp”; submit(); } }
1. 对于页面中物料代码前面的checkbox代码如下:<input type="checkbox" name="selectFlag" class="checkbox1">
2. 其中的’全选’按钮的响应事件代码如下:
//checkbox‘全选’与‘全不选’函数
function checkAll() {
var checkBoxs = document.getElementsByName("selectFlag");
for(var i = 0;i<checkBoxs.length;i++){
checkBoxs[i].checked=document.getElementById("ifAll").checked;
}
下面是’删除’事件的响应代码:
function delete () {
//遍历所有的checkbox选项
var a = document.getElementsByName("selectFlag");
var flag = false;
for(var i=0;i<a.length;i++){
if(a[i].checked==true){
flag = true;
break;
}
}
//根据遍历以后的标识符来判断是否有要删除的
if(flag==false){
alert("请选择要删除的物料!");
return;
}
//提示用户是否要确认删除
if(window.confirm("确认要删除选中的物料?")){
with(document.getElementById("ItemForm")){
method="post";
action="item_delete.jsp";
submit();
}
}
}
这就是checkbox的一个简单应用。