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 相关文章推荐
Js组件的一些写法
Sep 10 Javascript
JavaScript高级程序设计 DOM学习笔记
Sep 10 Javascript
Jquery提交表单 Form.js官方插件介绍
Mar 01 Javascript
uploadify在Firefox下丢失session问题的解决方法
Aug 07 Javascript
JS实现动画兼容性的transition和transform实例分析
Dec 13 Javascript
js Canvas绘制圆形时钟教程
Feb 06 Javascript
基于Vue2.0的分页组件
Mar 16 Javascript
简单的JS控制button颜色随点击更改的实现方法
Apr 17 Javascript
利用C/C++编写node.js原生模块的方法教程
Jul 07 Javascript
浅谈vux之x-input使用以及源码解读
Nov 04 Javascript
node 文件上传接口的转发的实现
Sep 23 Javascript
vue实现公共方法抽离
Jul 31 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
Terran兵种对照表
2020/03/14 星际争霸
PHP 金额数字转换成英文
2010/05/06 PHP
如何利用php array_multisort函数 对数据库结果进行复杂排序
2013/06/08 PHP
php中curl、fsocket、file_get_content三个函数的使用比较
2014/05/09 PHP
ThinkPHP框架实现数据增删改
2017/05/07 PHP
Firefox getBoxObjectFor getBoundingClientRect联系
2008/10/26 Javascript
javascript 自定义事件初探
2009/08/21 Javascript
jQuery之$(document).ready()使用介绍
2012/04/05 Javascript
实例分析javascript中的call()和apply()方法
2014/11/28 Javascript
JavaScript实现基于Cookie的存储类实例
2015/04/10 Javascript
JS或jQuery获取ASP.NET服务器控件ID的方法
2015/06/08 Javascript
AngularJS 最常用的功能汇总
2016/02/17 Javascript
微信小程序去哪里找 小程序到底如何使用(附小程序名单)
2017/01/09 Javascript
angular2倒计时组件使用详解
2017/01/12 Javascript
jquery实现表单获取短信验证码代码
2017/03/13 Javascript
微信小程序仿朋友圈发布动态功能
2018/07/15 Javascript
浅探express路由和中间件的实现
2019/09/30 Javascript
nodeJs项目在阿里云的简单部署
2020/11/27 NodeJs
Python urlopen 使用小示例
2008/09/06 Python
python中__call__方法示例分析
2014/10/11 Python
Python使用urllib2模块抓取HTML页面资源的实例分享
2016/05/03 Python
Python中使用asyncio 封装文件读写
2016/09/11 Python
python3 面向对象__类的内置属性与方法的实例代码
2018/11/09 Python
Python3.5文件读与写操作经典实例详解
2019/05/01 Python
python中selenium操作下拉滚动条的几种方法汇总
2019/07/14 Python
详解用Python进行时间序列预测的7种方法
2020/03/13 Python
python实现发送带附件的邮件代码分享
2020/09/22 Python
推荐WEB开发者最佳HTML5和CSS3代码生成器
2015/11/24 HTML / CSS
澳大利亚运动鞋商店:Platypus Shoes
2019/09/27 全球购物
Ibatis如何使用动态表名
2015/07/12 面试题
体育教育专业自荐信范文
2013/12/20 职场文书
初婚初育证明
2014/01/14 职场文书
悬空寺导游词
2015/02/05 职场文书
员工家属慰问信
2015/03/24 职场文书
导游词之泉州崇武古城
2019/12/20 职场文书
Python集合set()使用的方法详解
2022/03/18 Python