js实现表单项的全选、反选及删除操作示例


Posted in Javascript onJune 05, 2020

本文实例讲述了js实现表单项的全选、反选及删除操作。分享给大家供大家参考,具体如下:

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>网站会员激活码管理</title>
<script language="javascript">
function ReSel(){
    for(i=0;i<document.form1.logs.length;i++){ //这一用法只对form表单有效
        document.form1.logs[i].checked = true; //如果是实现【全不选】的话,改成false即可
    }
}
function SeSel(){
    for(i=0;i<document.form1.logs.length;i++){
        if(document.form1.logs[i].checked) document.form1.logs[i].checked = false;
        else document.form1.logs[i].checked = true;
    }
}
function DelSel(){
     var nid = getCheckboxItem();
     if(nid==""){
         alert("请选择项目!\r\n");
         return ;
     }
     location.href = "member_activation.php?dopost=del&ids="+nid;
}
//获得选中文件的文件名
function getCheckboxItem(){
     var allSel="";
     if(document.form1.logs.value) return document.form1.logs.value;
     for(i=0;i<document.form1.logs.length;i++)
     {
         if(document.form1.logs[i].checked){
             if(allSel=="")
                 allSel=document.form1.logs[i].value;
             else
                 allSel=allSel+"-"+document.form1.logs[i].value;
         }
     }
   //alert(allSel);  //1-2-7
     return allSel;
}
</script>
 
</head>
<body background='images/allbg.gif' leftmargin='8' topmargin='8'>
 
<table width="98%" border="0" align="center" cellpadding="2" cellspacing="1" bgcolor="#cfcfcf">
  <tr>
   <td>激活码列表</td>
  </tr>
  <tr bgcolor="#FEFCEF" height="30" align="center"> 
   <td width="3%">选择</td>
   <td width="5%">id</td>
   <td width="30%">激活码</td>
  </tr>
  <form name="form1">
    {dede:datalist} 
    <tr height="26" align="center" bgcolor="#FFFFFF" onMouseMove="javascript:this.bgColor='#FCFDEE';"
      onMouseOut="javascript:this.bgColor='#FFFFFF';"><!--onMouseMove/onMouseOut:鼠标移动到该行后,被选中的行变色-->
     <td><input name='logs' type='checkbox' value='{dede:field.id/}' /></td>
     <td>{dede:field.id/}</td>
     <td>{dede:field.core/}</td>
    </tr>
    {/dede:datalist}
  </form>
  <tr bgcolor="#ffffff"> 
   <td height="36" colspan="9">
      <a class="coolbg" onClick="ReSel();" >全选</a>
    <a class="coolbg" onClick="SeSel();" >反选</a>
      <a class="coolbg" onClick="DelSel();">删除</a>
   </td>
  </tr>
</table>
 
</body>
</html>

member_activation.php

//删除选定状态
if($dopost=="del")
{
  $ids = explode('-',$ids);
  $dquery = "";
  foreach($ids as $id)
  {
    if($dquery=="")
    {
      $dquery .= "id='$id' ";
    }
    else
    {
      $dquery .= " OR id='$id' ";
    }
  }
  if($dquery!="") $dquery = " WHERE ".$dquery;
  $dsql->ExecuteNoneQuery("DELETE FROM cr_member_activation $dquery");
  ShowMsg("成功删除指定的记录!","./index.php");
  exit();
}

js实现表单项的全选、反选及删除操作示例

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
javascript 函数声明与函数表达式的区别介绍
Oct 05 Javascript
JavaScript用Number方法实现string转int
May 13 Javascript
js获取时间并实现字符串和时间戳之间的转换
Jan 05 Javascript
JS中使用FormData上传文件、图片的方法
Aug 07 Javascript
手机移动端实现 jquery和HTML5 Canvas的幸运大奖盘特效
Dec 06 Javascript
3分钟掌握常用的JS操作JSON方法总结
Apr 25 Javascript
JavaScript实现的文本框placeholder提示文字功能示例
Jul 25 Javascript
如何使用pm2快速将项目部署到远程服务器
Mar 12 Javascript
在vue和element-ui的table中实现分页复选功能
Dec 04 Javascript
小程序实现长按保存图片的方法
Dec 31 Javascript
vue实现div单选多选功能
Jul 16 Javascript
vue项目开启Gzip压缩和性能优化操作
Oct 26 Javascript
一篇文章带你使用Typescript封装一个Vue组件(简单易懂)
Jun 05 #Javascript
vscode 插件开发 + vue的操作方法
Jun 05 #Javascript
vue渲染方式render和template的区别
Jun 05 #Javascript
Vue是怎么渲染template内的标签内容的
Jun 05 #Javascript
Vue 如何使用props、emit实现自定义双向绑定的实现
Jun 05 #Javascript
VueX模块的具体使用(小白教程)
Jun 05 #Javascript
Vuex的热更替如何实现
Jun 05 #Javascript
You might like
用PHP和ACCESS写聊天室(四)
2006/10/09 PHP
教你如何在CI框架中使用 .htaccess 隐藏url中index.php
2014/06/09 PHP
php实现表单多按钮提交action的处理方法
2015/10/24 PHP
PHP抓取淘宝商品的用户晒单评论+图片+搜索商品列表实例
2016/04/14 PHP
三个思路解决laravel上传文件报错:413 Request Entity Too Large问题
2017/11/13 PHP
js中几种去掉字串左右空格的方法
2006/12/25 Javascript
Mootools 1.2教程 正则表达式
2009/09/15 Javascript
Aptana调试javascript图解教程
2009/11/30 Javascript
javascript入门基础之私有变量
2010/02/23 Javascript
使用滤镜设置透明导致 IE 6/7/8/9 解析异常的解决方法
2011/04/07 Javascript
$.getJSON在IE下失效的原因分析及解决方法
2013/06/16 Javascript
使用JavaScript判断图片是否加载完成的三种实现方式
2014/05/04 Javascript
使用documentElement正确取得当前可见区域的大小
2014/07/25 Javascript
javascript入门教程基础篇
2015/11/16 Javascript
分享Javascript实用方法二
2015/12/13 Javascript
jquery UI Datepicker时间控件的使用及问题解决
2016/04/28 Javascript
整理关于Bootstrap模态弹出框的慕课笔记
2017/03/29 Javascript
jquery图片放大镜效果
2017/06/23 jQuery
浅谈基于Vue.js的移动组件库cube-ui
2017/12/20 Javascript
[52:22]EG vs VG Supermajor小组赛B组 BO3 第一场 6.2
2018/06/03 DOTA
python去除所有html标签的方法
2015/05/05 Python
解决安装tensorflow遇到无法卸载numpy 1.8.0rc1的问题
2018/06/13 Python
pygame游戏之旅 如何制作游戏障碍
2018/11/20 Python
python读写Excel表格的实例代码(简单实用)
2019/12/19 Python
Python ini文件常用操作方法解析
2020/04/26 Python
python基于socket函数实现端口扫描
2020/05/28 Python
python3.6中anaconda安装sklearn踩坑实录
2020/07/28 Python
日本著名化妆品零售网站:Cosme Land
2019/03/01 全球购物
中东奢侈品市场:Coveti
2019/05/12 全球购物
巴西葡萄酒商店:Divvino
2020/02/22 全球购物
公安局负责人查摆问题及整改方案
2014/09/27 职场文书
暑期工社会实践报告
2015/07/13 职场文书
《假如》教学反思
2016/02/17 职场文书
如何写好竞聘报告
2019/04/03 职场文书
Python pandas读取CSV文件的注意事项(适合新手)
2021/06/20 Python
Nginx代理Redis哨兵主从配置的实现
2022/07/15 Servers