zoukankan      html  css  js  c++  java
  • [总结]实现表格中对checkbox的操作

    request.getParameterValues(String   name)是获得如checkbox类(名字相同,但值有多个的数据。接收数组变量 ,如checkobx类型     
    request.getParameter(String   name)是获得相应名的数据,如果有重复的名,则返回第一个的值 . 接收一般变量 ,如text类型

    html代码如下:

    <tr>
    	<td><input type="checkbox" name="conditions" value="<%=list.get(i).getI_id() %>" id="checkbox+<%=i%>"/>						
    	</td>
    	<td><%=list.get(i).getName()%></td>
    	<td><%=list.get(i).getMoblie()%></td>
    	<td><%=list.get(i).getAddress()%></td>
    	<td><%=list.get(i).getMail()%></td>
    	<td>
          <a           	href="javascript:doUpdate('<%=list.get(i).getI_id()%>','<%=list.get(i).getName()%>','<%=list.get(i).getMoblie()%>','<%=list.get(i).getAddress()%>','<%=list.get(i).getMail()%>')">修改&nbsp&nbsp</a>
    	 <a href="javascript:doDelete('<%=list.get(i).getI_id()%>')">&nbsp&nbsp删除</a></td>
    </tr>
    

    注意到,checkbox的name都是一致的,value则是我从后端查回来的id,id是name和value的组装

    Js代码如下:

    function check(){
    	 $("document").ready(function(){
    		 var myTable =  document.getElementById("myTable");
    		 for(var i=0;i<myTable.rows.length;i++){
    			 if($("input[id='checkbox+"+i+"']").is(":checked")){
                   //判断checkbox是否被选中
    				 $("input[id='checkbox+"+i+"']").attr('name','checked');
    				//将被选中的checkbox的name改掉
    			 }
    		 }		
    	 });
    	 $("#export-form").submit();
    }
    

    同时附上JQuery判断checkbox的一系列方法

    $("[name='checkbox']").attr("checked",'true');//全选
    $("[name='checkbox']").removeAttr("checked");//取消全选
    $("[name='checkbox']:even").attr("checked",'true');//选中所有奇数
    

    注意js中字符串的拼接,单引号''双引号的使用"",这个真是坑了我

    服务端(java)的代码如下

    String[] str = request.getParameterValues("checked");
    List<addressbookfunctionVO> list_ = abf.searchById(str);
    return list_;
    
  • 相关阅读:
    jQuery---自定义动画 animate();
    jQuery---清空节点和删除节点
    HTML5与HTML4的区别
    前端开发CSS清除浮动的方法有哪些?
    关于为什么使用React新特性Hook的一些实践与浅见
    js 设计模式:观察者和发布订阅模式
    easyUI dataGrid主从表点击展开问题
    正则表达式
    JS高级---拷贝继承:把一个对象中的属性或者方法直接复制到另一个对象中
    vue-element-admin框架快速入门
  • 原文地址:https://www.cnblogs.com/scnulyp/p/6533371.html
Copyright © 2011-2022 走看看