核心思想：當點選批量刪除會觸發一個js事件，通過js獲取指定複選框選中集合的值，再發送url請求進行後臺刪除操作。

• 以實際專案中批量刪除幼兒資訊為例：

                                                            一、前端 

步驟

• 複選框：

<input type="checkbox" name="childrenId" value="${children.childrenId}">

• 繫結按鈕 :

<button onclick="deleteChildren()">批量刪除</button>

• js操作 :

<script type="text/javascript">	
	/* 批量刪除幼兒 */
	//首先定義一個字串用來拼接儲存複選框值 
	var childrenId = '';
	function deleteChildren() {
		//獲取指定複選框集
	 	var list = document.getElementsByName("childrenId");
		//迴圈遍歷每一個複選框
	 	for ( var i = 0; i < list.length; i++) {
	 		 //如果某個複選框被選中
			 if (list[i].checked) {
				 //將該複選框的value值拼接到字串childrenId後 
				childrenId = childrenId+list[i].value+",";			
			} 
	 	} 
		//如果最後childrenId的值為空串，說明介面一個複選框都未選中
	 	if(childrenId==''){
	 		//則提示資訊
	 		alert("請選擇要刪除的資料!");
	 	}
	 	else{
	 		//如果有選中的則觸發請求進行刪除
			window.location.href = "deleteManyChildren.mvc?childrenId="+childrenId;
	 	} 
	}
	
</script>
 

                                                             二、後端 

• controller

        /*
	 * 批量刪除幼兒資訊
	 */
	@RequestMapping("deleteManyChildren")
	public String deleteManyChildren(Integer[] childrenId){
	
		int i = childrenService.deleteManyChildren(childrenId);
		//如果刪除成功
		if(i > 0){
			//重定向到幼兒管理主介面
			return "redirect:childrenManagerUI.mvc";
		}
		//刪除異常
		return "404";
	}
 

•  service介面

public int deleteManyChildren(Integer[] childrenId);

• service實現 

        /*
	 * 批量刪除
	 */
	public int deleteManyChildren(Integer[] childrenId) {
		
		return childrenMapper.deleteManyChildren(childrenId);
	}

•  mapper介面

    //批量刪除
    int deleteManyChildren(Integer[] childrenId);

• mapper實現 

  <!-- 批量刪除 -->
  <delete id="deleteManyChildren" parameterType="List">
  	delete from children
  	<where>
  		<foreach collection="array" item="childrenId" open="and children_id in (" close=")" separator=",">
	   		#{childrenId}
		</foreach>
  	</where>
  </delete>