<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default4.aspx.cs" Inherits="Default4" %>

 <!DOCTYPE html>

 <html xmlns="http://www.w3.org/1999/xhtml">

 <head runat="server">

     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

     <title></title>

 </head>

 <body>

     <form id="form1" runat="server">

         <div>

             <table style="width: 100%; text-align: center; background-color: navy;">

                 <tr style="color: white;">

                     <td>全选

                         <input type="checkbox" id="ckall" />

                     </td>

                     <td>ids</td>

                     <td>pic</td>

                     <td>name</td>

                     <td>nowPrice</td>

                     <td>oldPrice</td>

                     <td>context</td>

                 </tr>

                 <asp:Repeater ID="Repeater1" runat="server">

                     <ItemTemplate>

                         <tr style="background-color: white;">

                             <td>

                                 <input type="checkbox" class="ck" name="ck" value="<%#Eval("ids") %>" />

                             </td>

                             <td><%#Eval("ids") %> </td>

                             <td><%#Eval("pic") %></td>

                             <td><%#Eval("name") %></td>

                             <td><%#Eval("nowPrice") %></td>

                             <td><%#Eval("oldPrice") %></td>

                             <td><%#Eval("context") %></td>

                         </tr>

                     </ItemTemplate>

                 </asp:Repeater>

             </table>

             <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>

             <asp:Button ID="Button1" runat="server" Text="删除" />

         </div>

     </form>

 </body>

 </html>

 <script type="text/javascript">

     document.getElementById("ckall").onclick = function () {

         var oCks = document.getElementsByClassName("ck");

         for (var i = ; i < oCks.length; i++) {

             oCks[i].checked = this.checked;

         }

     };

     var ooCks = document.getElementsByClassName("ck");

     for (var i = ; i < ooCks.length; i++) {

         ooCks[i].onclick = function () {

             var count = ;

             for (var j = ; j < ooCks.length; j++) {

                 if (ooCks[j].checked == false) {

                     count++;

                 }

             }

             if (count > ) {

                 document.getElementById("ckall").checked = false;

             }

             else {

                 document.getElementById("ckall").checked = true;

             }

         };

     }

 </script>

删除操作：

 using System;

 using System.Collections.Generic;

 using System.Linq;

 using System.Web;

 using System.Web.UI;

 using System.Web.UI.WebControls;

 public partial class Default4 : System.Web.UI.Page

 {

     protected void Page_Load(object sender, EventArgs e)

     {

         if (!IsPostBack)

         {

             Repeater1.DataSource = new gouwuData().Select();

             Repeater1.DataBind();

         }

         Button1.Click += Button1_Click;

     }

     void Button1_Click(object sender, EventArgs e)

     {

         string s = Request["ck"];

         //Label1.Text = s;

         if (s != null)

         {

             string[] ss = s.Split(',');

             for (int i = ; i < ss.Length; i++)

             {

                 new gouwuData().Delete(Convert.ToInt32(ss[i]));

             }

             Response.Redirect("Default4.aspx");

         }

         else

         {

             Label1.Text = "未选择数据！";

         }

     }

 }

Js 实战3（实现全选）的更多相关文章

  1. JS中表格的全选和删除要注意的问题

    在项目开发中,由于刚刚开始做项目,我对js还不是很精通,所以在用js对表格的全选和删除中遇到了不少问题,后来通过查找资料解决了,之后总结了一下关于js表格的全选和删除出现的一些问题,希望能帮助到大家. ...

  2. Vue.js实现checkbox的全选和反选

    小颖之前写的代码存在一个bug,就是当你选择全选的时候去掉后面的一个选项,再点全选结果就是反的了.很感谢博客园的朋友帮我改了这个问题嘻嘻,下面一起来看看具体是怎么实现的吧. 1.html <te ...

  3. vue.js 批量删除跟全选，反选效果

    <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" ...

  4. js实现checkbox的全选和全不选功能

    html代码: <form name="form1" method="post" action="manage.php?act=sub" ...

  5. <一>初探js特效魅力之全选不选反选04

    初探js特效魅力04 我们在进入到公司里面工作的时候,做一个同一个项目,经常是大家分工合作,当我们写css时,一般不写在行间,因为这样会被误操作,也就是被乱删了都不知道,这样的后果是很难检查的 ,因为 ...

  6. asp.net中Repeater结合js实现checkbox的全选/全不选

    前台界面代码: <input name="CheckAll" type="checkbox" id="CheckAll" value= ...

  7. js和jq实现全选反选

    在前端中用到全选反选的案例并不少,在这里呢我就实现这个功能给大家参考参考. 这里呢就先贴上我的html和css代码 <div class="wrap"> <tab ...

  8. JS 控制checkbox 获取 全选 全不选 一行不选择全选则不被选择 所有选择全选被选择

    //点击全选button的事件操作 function selectAll(){ var allcheckBoxs=document.getElementsByName("iTo") ...

  9. js初学—实现checkbox全选功能

    布局如下: <p ><input type="checkbox" id="che1"/>全选</p><div id=& ...

  10. js实现checkbox的全选/取消

    所有的操作都将使用jquery进行. 主要是为了实现指定内容的批量/单独删除操作. 先看一下页面的设计. 实现操作的主要地方是: 首先实现单击“标题”旁的checkbox实现所有条目的选择. 要点:j ...

随机推荐

  1. bzoj1628 [Usaco2007 Demo]City skyline（单调栈）

    Description Input 第一行给出N,W 第二行到第N+1行:每行给出二个整数x,y,输入的x严格递增,并且第一个x总是1 Output 输出一个整数,表示城市中最少包含的建筑物数量 Sa ...

  2. RocEDU.阅读.写作《苏菲的世界》书摘(七）

    * 康德认为"事物本身"和"我眼中的事物"是不一样的.这点很重要.我们永远无法确知事物"本来"的面貌.我们所知道的只是我们眼中"看 ...

  3. 20145311 《Java程序设计》第九周学习总结

    20145311 <Java程序设计>第九周学习总结 教材学习内容总结 第十六章 整合数据库 16.1JDBC 16.1.1JDBC简介 JDBC(Java DataBase Connec ...

  4. luogu p3366 最小生成树模板

    倒腾了一个小时  自己也没去看网上的 总算自己能写出来模板了 kruskal //最小生成树 每次找最短的边 #include<bits/stdc++.h> using namespace ...

  5. MyBatis基本工作原理

    Application是程序员开发的Java代码,蓝色为MyBatis框架. API是MyBatis提供的增删改查等功能接口. 老式SQL写法我们在Dao中写SQL: SELECT * FROM us ...

  6. C++ 自定义错误类

    #include <iostream> #include <exception> using namespace std; struct MyException : publi ...

  7. 如何识别网页类型(wap页面还是wise页面)

    思路很简单,就是通过网页结构的一些特征来区分,当然也可以通过url的格式来区分,不过这个错误率较高,因为有很多小网站的url设计不规范. 网页特征包括两大类: 1.meta信息: 一般wap页面都会为 ...

  8. 百度地图API 显示区域边界及地名定位

    百度地图API 显示区域边界及地名定位 这个定位一共用了两个方法组成 一个是定位绘制区域边界线,另一个是地名定位 原理: 当用户输入省.市.县.区这种大地名时,我们要定位用户输入的这个位置,并显示轮廓 ...

  9. CSS 列表样式详解

    CSS列表用于前端的列表排列. CSS列表属性作用如下: 设置不同的列表项标记为有序列表 设置不同的列表项标记为无序列表 设置列表项标记为图像 列表 在HTML中,有两种类型的列表: 无序列表 - 列 ...

  10. Mybatis四种分页方式

    数组分页 查询出全部数据,然后再list中截取需要的部分. mybatis接口 List<Student> queryStudentsByArray(); xml配置文件 <sele ...