常用于页面交互的JavaScript的一些技巧分析

本文链接：https://blog.youkuaiyun.com/XiaoYouSiFang/article/details/5859717

本文介绍了如何使用JavaScript控制页面上的Checkbox，实现单选修改和多选删除的功能。通过具体示例展示了遍历Checkbox、检查选中状态及触发相应事件的方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

JavaScript是用于页面交互的一种技术，它能控制页面元素并进行操作。下面接单的介绍checkbox的一些常用。

我们以下图为例：

用户可以对其中的记录进行修改和删除，但是修改只能选中一条记录，而删除则可以对多条记录进行。这就要用到javaScript页面交互。

以响应修改事件函数为例，代码如下:

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的一个简单应用。