JavaScript实现表单项的全选、反选以及删除操作 详细代码

  1. <html>
  2. <head>
  3. <title>test</title>
  4. <script language="javascript">
  5. function ReSel(){
  6.     for(i=0;i<document.form1.logs.length;i++){  //这一用法只对form表单有效
  7.         document.form1.logs[i].checked = true;  //如果是实现【全不选】的话,改成false即可
  8.     }
  9. }
  10. function SeSel(){
  11.     for(i=0;i<document.form1.logs.length;i++){
  12.         if(document.form1.logs[i].checked) document.form1.logs[i].checked = false;
  13.         else document.form1.logs[i].checked = true;
  14.     }
  15. }
  16. function DelSel(){
  17.      var nid = getCheckboxItem();
  18.      if(nid==""){
  19.           alert("请选择项目!\r\n");
  20.           return ;
  21.      }
  22. location.href = "member_activation.php?dopost=del&ids="+nid;
  23. }
  24. //获得选中文件的文件名
  25. function getCheckboxItem(){
  26.      var allSel="";
  27.      if(document.form1.logs.value) return document.form1.logs.value;
  28.      for(i=0;i<document.form1.logs.length;i++)
  29.      {
  30.          if(document.form1.logs[i].checked){
  31.              if(allSel=="")
  32. allSel=document.form1.logs[i].value;
  33.              else
  34. allSelallSel=allSel+"-"+document.form1.logs[i].value;
  35.          }
  36.      }
  37.      return allSel;
  38. }
  39. </script>
  40. </head>
  41. <body>
  42. <table>
  43. <tr>
  44. <td>列表</td>
  45. </tr>
  46. <tr>
  47. <td>选择</td>
  48. <td>id</td>
  49. <td>名字</td>
  50. </tr>
  51. <form name="form1">
  52.          {foreach  name="list"  key='key' item='val'}
  53. <tr>
  54. <td><input name='logs' type='checkbox' value='{$val.id/}' /></td>
  55. <td>{$val.id}</td>
  56. <td>{$val.name}</td>
  57. </tr>
  58.         {/foreach}
  59. </form>
  60. <tr bgcolor="#ffffff">
  61. <td height="36" colspan="9">
  62. <a class="coolbg" onClick="ReSel();" >全选</a>
  63. <a class="coolbg" onClick="SeSel();" >反选</a>
  64. <a class="coolbg" onClick="DelSel();">删除</a>
  65. </td>
  66. </tr>
  67. </table>
  68. </body>
  69. </html>

JavaScript表单多选

以上代码有些地方请自行修改成自己需要的代码!如果有不懂的可以留言!

    A+
发布日期:2017年05月08日  所属分类:javascript
最后修改时间:2017-05-08 17:43
评分: (当前没有评级)
付杰
服务器管理面板/主机控制面板“安装”服务
服务器管理面板/主机控制面板“安装”服务
  • ¥ 9.9元
  • 市场价:49.9元
PHP运行环境 Wamp Lamp Lnmp 安装、配置、搭建服务
PHP运行环境 Wamp Lamp Lnmp 安装、配置、搭建服务
  • ¥ 9.9元
  • 市场价:49.9元
SEO顾问服务 中小型网站 单站/最低99.9元 全方位优化
SEO顾问服务 中小型网站 单站/最低99.9元 全方位优化
  • ¥ 99.9元
  • 市场价:5000元
花牛苹果 甘肃天水 李宏恩家自种 1斤 包邮
花牛苹果 甘肃天水 李宏恩家自种 1斤 包邮
  • ¥ 6.8元
  • 市场价:8.8元

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: