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 相关文章推荐
extjs之去除s.gif的影响
Dec 25 Javascript
JavaScript获取/更改文本框的值的实例代码
Aug 02 Javascript
jQuery中:submit选择器用法实例
Jan 03 Javascript
js实现匹配时换色的输入提示特效代码
Aug 17 Javascript
jQuery Validate初步体验(一)
Dec 12 Javascript
原生js三级联动的简单实现代码
Jun 07 Javascript
AngularJS入门教程之控制器详解
Jul 27 Javascript
浅析ES6的八进制与二进制整数字面量
Aug 30 Javascript
ES6使用Set数据结构实现数组的交集、并集、差集功能示例
Oct 31 Javascript
微信小程序仿知乎实现评论留言功能
Nov 28 Javascript
详解 微信小程序开发框架(MINA)
May 17 Javascript
vue实现图片上传到后台
Jun 29 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
关于url地址传参数时字符串有回车造成页面脚本赋值失败的解决方法
2013/06/28 PHP
Laravel 5.5基于内置的Auth模块实现前后台登陆详解
2017/12/21 PHP
ThinkPHP框架整合微信支付之JSAPI模式图文详解
2019/04/09 PHP
找到了一篇jQuery与Prototype并存的冲突的解决方法
2007/08/29 Javascript
Jquery操作下拉框(DropDownList)实现取值赋值
2013/08/13 Javascript
JavaScript运行时库属性一览表
2014/03/14 Javascript
jQuery 隐藏和显示 input 默认值示例
2014/06/03 Javascript
js实现简单随机抽奖的方法
2015/01/27 Javascript
基于Node.js的强大爬虫 能直接发布抓取的文章哦
2016/01/10 Javascript
Es6 写的文件import 起来解决方案详解
2016/12/13 Javascript
Vue响应式原理详解
2017/04/18 Javascript
详解Vue.js基于$.ajax获取数据并与组件的data绑定
2017/05/26 Javascript
vue引入swiper插件的使用实例
2017/07/19 Javascript
vue中七牛插件使用的实例代码
2017/07/28 Javascript
javascript 缓冲运动框架的实现
2017/09/29 Javascript
Vue2.0 http请求以及loading展示实例
2018/03/06 Javascript
解决angularJS中input标签的ng-change事件无效问题
2018/09/13 Javascript
微信小程序封装多张图片上传api代码实例
2019/12/30 Javascript
js实现简单扫雷
2020/11/27 Javascript
js和jquery判断数据类型的4种方法总结
2020/08/28 jQuery
JavaScript实现音乐导航效果
2020/11/19 Javascript
深入理解Python中命名空间的查找规则LEGB
2015/08/06 Python
在cmd命令行里进入和退出Python程序的方法
2018/05/12 Python
python使用matplotlib绘制热图
2018/11/07 Python
用python脚本24小时刷浏览器的访问量方法
2018/12/07 Python
Python3 shutil(高级文件操作模块)实例用法总结
2020/02/19 Python
python zip()函数的使用示例
2020/09/23 Python
全球最大的跑步用品商店:Road Runner Sports
2016/09/11 全球购物
美国亚洲时尚和美容产品的一站式网上商店:Stylevana
2019/09/05 全球购物
国际商务系学生个人的自我评价
2013/11/26 职场文书
四议两公开实施方案
2014/03/28 职场文书
学校党员对照检查材料
2014/08/28 职场文书
财务总监岗位职责
2015/02/03 职场文书
2016高考冲刺决心书
2015/09/23 职场文书
2019数学教师下学期工作总结
2019/06/27 职场文书
餐厅营销的秘密:为什么老顾客会流水?
2019/08/08 职场文书