zoukankan      html  css  js  c++  java
  • JavaScript实现复选框全选与全不选的效果

         //里面涉及到几张图片,有需要的可以联系我要,直接私信我就行,每天在这个点都会上线,看到就回,或者从我的资料里面找我的联系方式,收到之后会发给你们的
    
    
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>全选效果</title>
    <style type="text/css">
    .bg{
    	background-image: url(images/list_bg.gif);
    	background-repeat: no-repeat;
    	 730px;
    }
    td{text-align:center;
    font-size:13px;
    line-height:25px;
    }
    body{margin:0}
    </style>
     <script type="text/JavaScript">
     function check(){
     	var oInput=document.getElementsByName("product");
     	for (var i=0;i<oInput.length;i++)
     		oInput[i].checked=document.getElementById("all").checked;
     }
    </script>
    </head>
    
    <body><table border="0" cellspacing="0" cellpadding="0" class="bg">
      <tr>
        <td style="height:40px;"></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
      <tr style="font-weight:bold;">
        <td><input id="all" type="checkbox" value="全选" οnclick="check();" />全选</td>
        <td>商品图片</td>
        <td>商品名称/出售者/联系方式</td>
        <td>价格</td>
      </tr>
      <tr>
    	<td colspan="4"><hr style="border:1px  #CCCCCC dashed" /></td>
        </tr>
      
      <tr>
        <td><input name="product" type="checkbox" value="1" /></td>
        <td><img src="images/list0.jpg" alt="alt" /></td>
        <td>杜比环绕,家庭影院必备,超真实享受<br />
        出售者:ling112233<br />
        <img src="images/online_pic.gif" alt="alt" /> 
    	<img src="images/list_tool_fav1.gif" alt="alt" /> 收藏</td>
        <td>一口价<br />
        2833.0 </td>
      </tr>
      <tr>
    	<td colspan="4"><hr style="border:1px  #CCCCCC dashed" /></td>
        </tr>
      <tr>
        <td><input name="product" type="checkbox" value="2" /></td>
        <td><img src="images/list1.jpg" alt="alt" /></td>
        <td>NVDIA 9999GT 512MB 256bit极品显卡,不容错过<br />
          出售者:aipiaopiao110 <br />
        <img src="images/online_pic.gif" alt="alt" /> 
    	<img src="images/list_tool_fav1.gif" alt="alt" /> 收藏</td>
        <td>一口价<br />
        6464.0 </td>
      </tr>
      <tr>
    	<td colspan="4"><hr style="border:1px  #CCCCCC dashed" /></td>
        </tr>
      <tr>
        <td><input name="product" type="checkbox" value="3" /></td>
        <td><img src="images/list2.jpg" alt="alt" /></td>
        <td>精品热卖:高清晰,30寸等离子电视<br />
          出售者:阳光的挣扎 <br />
        <img src="images/online_pic.gif" alt="alt" /> 
    	<img src="images/list_tool_fav1.gif" alt="alt" /> 收藏</td>
        <td>一口价<br />
        18888.0 </td>
      </tr>
      <tr>
    	<td colspan="4"><hr style="border:1px  #CCCCCC dashed" /></td>
        </tr>
       <tr>
        <td><input name="product" type="checkbox" value="4" /></td>
        <td><img src="images/list3.jpg" alt="alt" /></td>
        <td>Sony索尼家用最新款笔记本 <br />
          出售者:疯狂的镜无<br />
        <img src="images/online_pic.gif" alt="alt" /> 
    	<img src="images/list_tool_fav1.gif" alt="alt" /> 收藏</td>
        <td>一口价<br />
         5889.0 </td>
      </tr>
      <tr>
    	<td colspan="4"><hr style="border:1px  #CCCCCC dashed" /></td>
        </tr>
    </table>
    
    </body>
    </html>
    

  • 相关阅读:
    使用 asp.net mvc和 jQuery UI 控件包
    ServiceStack.Redis 使用教程
    HTC T8878刷机手册
    Entity Framework CodeFirst 文章汇集
    2011年Mono发展历程
    日志管理实用程序LogExpert
    使用 NuGet 管理项目库
    WCF 4.0路由服务Routing Service
    精进不休 .NET 4.0 (1) asp.net 4.0 新特性之web.config的改进, ViewStateMode, ClientIDMode, EnablePersistedSelection, 控件的其它一些改进
    精进不休 .NET 4.0 (7) ADO.NET Entity Framework 4.0 新特性
  • 原文地址:https://www.cnblogs.com/a1111/p/12816715.html
Copyright © 2011-2022 走看看