JSP中checkbox实现全选等功能_1

最新推荐文章于 2022-07-24 17:13:52 发布
最新推荐文章于 2022-07-24 17:13:52 发布
阅读量1.2k 收藏 3
点赞数 1
分类专栏： JSP
如何jsp页面checkbox实现全选 -jscode ;用jsp如何获得本页面的文件名 
========================================

如何jsp页面checkbox实现全选 -jscode 用javascript吧。   

1，点击 checkbox全选

<html>   
<body>   
<script>   
function   kk(){   
var   handleEl   =   document.getElementById("kkHandler");   
var   els   =   document.getElementsByName("kk");   
for(i=0;i<els.length;i++){   
els[i].checked   =   handleEl.checked;   
}   
    
}   
</script>   
<input   type=checkbox   οnclick="kk()"   name="kkHandler">全选<br>   
<input   type=checkbox   name="kk">   
<input   type=checkbox   name="kk">   
</body>   

</html> 

2:在form表单中实现全选

 <form name="form" ID="Form1"> 

<input type="checkbox" name="id" value="" ID="Checkbox1">1 
<input type="checkbox" name="id" value="" ID="Checkbox2">2 
<input type="checkbox" name="chose" value="" οnclick="selectAll()" ID="Checkbox5">allselect 
</form> 
<script> 
function selectAll() 
{ 
if(!document.form.id.length){ 
    if(document.form.chose.checked){ 
      document.form.id.checked=true; 
    } 
    else{ 
      document.form.id.checked=false; 
    } 
} 
else{ 
    for(var i=0;i<document.form.id.length;i++){ 
      if(document.form.chose.checked){ 
        document.form.id[i].checked=true; 
      } 
      else{ 
        document.form.id[i].checked=false; 
      } 
    } 
}               
} 

</script> 

3:根据name全选

 1<input   type='checkbox'   name='info'   value='a'>   

2<input   type='checkbox'   name='info'   value='b'>   
3<input   type='checkbox'   name='info'   value='c'>   
4<input   type='checkbox'   name='info'   value='d'>   
5<input   type='checkbox'   name='info'   value='e'><br>   
<input   type='button'   value   ='   全选   'οnclick='check_all();'>   
<script>   
      function   check_all(){   
        arr   =   document.getElementsByName('info');   
        for(i=0;i<arr.length;i++){   
              arr[i].checked   =   true;   
        }   
      }   
</script>
===========================================
用jsp如何获得本页面的文件名 -javacode request.getRequestURI(); 
public String IdexOfString(String str,String str1)
{
if(str.lastIndexOf(str1)!=-1)
{
   int i=str.lastIndexOf(str1);
   str=str.substring(i+1);
}
return str;
}
wzq330995030
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JSP、JS实现多选全选操作
a281246240的专栏
05-27 5993
类似于淘宝购物车中的多选操作，可以全选操作，也可以部分选择操作 JSP页面显示代码： "+"Apple/苹果6 4.7寸港版删除 "+"Apple/苹果6 4.7寸港版删除 全选代码：   全选 这行代码是用来存放被选择的操作对象的id值； "全选"按钮功能实现代码： $(document).ready(function () { $("#all").cl
JSP 页面 checkbox 实现单选、多选效果
weixin_34133829的博客
03-07 3308
2019独角兽企业重金招聘Python工程师标准>>> ...
JSP之checkbox控件全选与取消全选。
m0_47550288的博客
04-13 338
文章目录前言一、pandas是什么？二、使用步骤1.引入库2.读入数据总结 前言 问题:This application has no explicit mapping for /error, so you are seeing this as a fallback.。 提示：以下是本篇文章正文内容，下面案例可供参考 一、pandas是什么？ 示例：pandas 是基于NumPy 的一种工具，该工具是为了解决数据分析任务而创建的。 二、使用步骤 1.引入库 代码如下（示例）： import numpy
jsp中点击一个多选框，实现全选或全不选
ZMC921的博客
08-20 8364
当点击页面表头的多选框，则每一行的多选框都会被选中或释放，实现了全选。JSP页面的代码中还实现了多选删除。其实全选也是为了实现多项选择然后删除。多选删除提交的时候用的是超链接提交表单，它的功能就是可以提交表单中没有的值。 js代码 function checkt(){ var checkAll=document.getElementById("checkAll"); conso
jsp实现全选与多选
zzq的博客
01-10 6546
直接看效果： 先看看布局怎么写的： 外面一个checkbox，name属性与下面用循环生成的不一样。 然后就是点击事件了： ok,简单的单选全选就OK了。 //-----end------
简易jsp+servlet项目实现 批量删除，全选，反选
weixin_42264823的博客
03-15 8364
今天这个小项目的增删改查都弄好了，然后想做一下批量删除，全选以及反选的这些功能，然后就奋斗了几个小时搞了出来，以此文纪念一下下。 1.批量删除。那么我们先从批量删除开始讲起，在前面的查询时候我们就遍历出了数据库里面的数据在jsp页面上了。 如果想要实现批量删除的话，在这些表格中的每一行前面都有一个选择框checkbox，首先这个选择框不是我们一个一个的加上去，而是让他跟随着遍历数据时的那个...
JS+JSP checkBox 全选具体实现
10-26
本文为大家介绍下使用JS+JSP实现checkBox全选，下面有个不错的示例，感兴趣的朋友可以参考下
Java中checkbox实现跨页多选的方法
08-31
在Java Web开发中，实现checkbox跨页多选功能是一项常见的需求，特别是在数据量大、需要分页展示的情况下。这个功能允许用户在多个页面上选择不同的选项，并在提交时能够保存所有选择，无论这些选项分布在多少个页面...
jquery实现checkbox全选全不选的简单实例
12-09
@ taglib prefix=”c” uri=”http://java.sun.com/jsp/jstl/core” %><%@ taglib prefix=”fn” uri=”http://java.sun.com/jsp/jstl/functions”%><%@ taglib prefix=”fmt” uri=”...
JSP列表中复选框批量选择功能实现
08-07
在JavaServer Pages (JSP) 开发中，常常需要实现用户界面中的批量选择功能，比如在列表中通过复选框来选中多个项目。本文将详细介绍如何在JSP中实现这样的功能，主要涉及HTML、JavaScript 和后端Java的交互。 首先...
js实现全选删除+jsp.+js
05-26
js+jsp实现全选删除 js+jsp实现全选删除 js+jsp实现全选删除
JavaWeb学习-案例练习-图书管理后台-6-全选思路和实现过程
Anthony_tester的博客
06-29 476
在我们之前的案例中，在list.jsp，查看商品的表格中是没有全选按钮的，我们删除图书，只能一个一个删除，如果考虑到批量删除呢，所以我们需要新增全选/全不选按钮。 1.需求 需要像红圈那样添加勾选按钮，点击全选，或者批量勾选，我们可以同时删除多本书籍。 2.添加全选思路分析 我们先利用前端知识，给商品编号前面添加一列，控件的type类型为checkbox. 打开list.jsp...
jsp实现全选全不选，简单整洁
weixin_62553731的博客
07-05 957
jsp中点击一个多选框，实现全选或全不选 当点击页面表头的多选框，则每一行的多选框都会被选中或释放，实现了全选。JSP页面的代码中还实现了多选删除。其实全选也是为了实现多项选择然后删除。多选删除提交的时候用的是超链接提交表单,它的... ...
JSP页面实现checkbox的全选功能
ping_and_yin的博客
01-13 3207
1、在jsp页面定义&lt;script&gt;标签 &lt;script type="text/javascript"         src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt; 以上这一段一定需要，因为是用网上的jq插件。     &lt;script type="text/j...
JSP 复选框全选
diepian8780的博客
04-07 420
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" cont...
第3章业务功能开发（实现全选按钮实时的响应）
weixin_59334478的博客
07-24 308
再次点击全选框时，实现全选框勾选取消，以及所有数据的复选框也进行勾选取消。点击全选框后，当点击数据项的复选框取消当前数据项的勾选，全选框也应取消勾选。该页面的数据来自jquery的拼接，这些数据全部拼接到tBody的标签框里。当点击全选框时，实现全选框勾选，以及所有数据的复选框也进行勾选。在index.jsp页面的js中进行编写。......
JSP复选框 全选
Leven的博客
01-20 2621
function checkAll(checkall) { arr = document.getElementsByName('info' ); if (checkall.checked == true) { for(i=0;i<arr.length;i++){ arr[i].checked
jsp页面checkbox全选或全部取消的代码
tyj315的博客
03-03 3886
jsp页面checkbox全选或全部取消的代码: $(function(){ /* 给所有条目的复选框添加click事件 */ $("input[name='checkboxBtn']").click(function() { var selectAll=document.getElementById('selectAll'); var all = $("input[name
jsp页面checkbox全选与单选并显示已选中数量
半坡人的博客
03-26 1924
checkbox全选与单选 第一步，设置checkbox标签 <center> <table> <tr><td>已选中【<span id="number"></span>】个</td><td></td></tr> <tr>&lt...
jsp实现复选框的全选与反选
最新发布
05-12
在 JSP 中实现复选框的全选与反选，可以通过 JavaScript 来实现。以下是一个简单的示例代码： ```html <html> <head> <script type="text/javascript"> function checkAll() { var checkboxes = document.getElementsByName('checkbox'); for (var i = 0; i < checkboxes.length; i++) { checkboxes[i].checked = true; } } function uncheckAll() { var checkboxes = document.getElementsByName('checkbox'); for (var i = 0; i < checkboxes.length; i++) { checkboxes[i].checked = false; } } function invertSelection() { var checkboxes = document.getElementsByName('checkbox'); for (var i = 0; i < checkboxes.length; i++) { checkboxes[i].checked = !checkboxes[i].checked; } } </script> </head> <body> <form> <input type="checkbox" name="checkbox" value="1">选项1 <input type="checkbox" name="checkbox" value="2">选项2 <input type="checkbox" name="checkbox" value="3">选项3 <br> <input type="button" value="全选" onclick="checkAll()"> <input type="button" value="反选" onclick="invertSelection()"> <input type="button" value="全不选" onclick="uncheckAll()"> </form> </body> </html> ``` 在这个例子中，我们使用了 JavaScript 来实现三个函数：`checkAll()`、`uncheckAll()` 和 `invertSelection()`。这些函数分别对应“全选”、“全不选”和“反选”按钮的点击事件。 `document.getElementsByName('checkbox')` 通过 name 属性获取所有复选框的 DOM 对象，然后使用循环遍历每个复选框，来实现全选、全不选和反选的功能。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值