html,删除复选框选中的内容

       首先是选中复选框,可以自己单击一个个的选,这个就不用多说了吧!也可以批量操作,如用全选按钮,主要是设置复选框的.checked值。可以通过调用javascript函数来实现。 方法如下:

         复选框的定义:<input id="id" name="dept" type='checkbox' >

          按钮的定义:<input type='button' value='全选' onClick='sltAll("dept")' name='button1'>(onclick指向的函数要用单引号)

          javascript里全选函数的实现:

         <script language="javascript">
         function sltAll(field)

       {
               field = document.getElementsByName(field)
       
                f or(i=0;i<field.length;i++)
                 {
                        field[i].checked = true;
                 }            
           }

          </script>

        选中以后接下来就是删除了。删除的一般是跟数据库连接的内容,要删除这些数据实际上就是根据选中的内容对数据库进行相应的delete操作。例如想要删除下面形式复选框选中的内容

     

         界面中的数据都是从一个数据库表里来的。

         复选框设置为:<input id=<%=typeId%> name="dept" type='checkbox' >,复选框的id是我从表里查询来的,即typeId。typeId是表的主键,每个typeId都唯一对应着表里的一列!所以要删除相应的列只要找到typeId就行了。

          删除按钮:<input type="submit" value="删除" name="tijiao" onClick='SelectCheckbox("dept",this.form)'>

          表单设置:<form name="form1" method="post" action="">

          javascript函数

          function SelectCheckbox(name,forml){
              var s=false;
              var boarId,n=0;
             var strid,strurl;
             name=document.getElementsByName(name)
            for(i=0;i<name.length;i++)
        {
              if(name[i].checked){
               n=n+1;
               s=true;
                boarId=name[i].id+"";
   
                if(n==1){
                   strid=boarId;
               }
               else {
                    strid=strid+","+boarId;
             }
         }
     }
           strurl="URL.jsp?id="+strid;
            if(!s){
               alert("请选择要删除的分类!");
                 return false;
                }
           if(confirm("你确定要删除这些分类吗?")){
       
             forml.action=strurl;
                forml.submit();
           }
  }    
 
</script> 

          按下”submit“按钮时,先根据onclick调用SelectCheckbox("dept",this.form)函数,传入的两个参数第一个是复选框的name属性名,第二个是表单对象。函数先找到所有的复选框,检查复选框是否选中,若选中则获取复选框的id值(实际为表中的编号!),并转换成字符的形式存到stride变量中。实际上选中stride最终会变为“编号1,编号2,编号3......”,这样就以字符的形式将所有要删除的I列的d号都保存到strid变量里了。接下来就是向其他网页传递要删除数据的编号了。forml的action属性指向要转到的URL,forml的submit()方法执行submit操作!这样就把要删的id都以字符的形式根据表单传到另一个页面了,可根据以下语句接收

         String s=request.getParameter("id");




你可以使用 JavaScript 来实现复选框的批量删除功能。下面是一个简单的示例代码: ```html <!DOCTYPE html> <html> <head> <title>复选框批量删除</title> </head> <body> <h1>复选框批量删除</h1> <input type="checkbox" id="checkAll" onclick="checkAllHandler()">全选/取消全选<br><br> <input type="checkbox" class="checkbox" value="item1">项目1<br> <input type="checkbox" class="checkbox" value="item2">项目2<br> <input type="checkbox" class="checkbox" value="item3">项目3<br> <input type="checkbox" class="checkbox" value="item4">项目4<br> <input type="checkbox" class="checkbox" value="item5">项目5<br><br> <button onclick="deleteSelectedItems()">删除选中项</button> <script> // 全选/取消全选的处理函数 function checkAllHandler() { var checkboxes = document.getElementsByClassName('checkbox'); var checkAll = document.getElementById('checkAll'); for (var i = 0; i < checkboxes.length; i++) { checkboxes[i].checked = checkAll.checked; } } // 删除选中项的处理函数 function deleteSelectedItems() { var checkboxes = document.getElementsByClassName('checkbox'); for (var i = 0; i < checkboxes.length; i++) { if (checkboxes[i].checked) { // 在这里执行删除操作,可以根据具体需求自行编写删除逻辑 console.log('删除项:' + checkboxes[i].value); } } } </script> </body> </html> ``` 这段代码创建了一个包含复选框的简单网页。通过点击全选复选框,可以选择或取消选择所有项目的复选框。点击“删除选中项”按钮后,会在控制台打印出选中项的值,你可以根据具体需求编写删除逻辑,例如发送删除请求或更新页面内容等。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值