PHP jQuery+Ajax實現大量刪除功能的方法

這篇文章主要介紹了PHP jQuery+AjaxPHP jQuery+Ajax實現大量刪除功能的方法,需要的朋友可以參考下

為了美觀，我還是引入了bootstrap的模態框，我引入的是自己的資料庫 library中的一張表 名為：maninfo表 是一張個人資訊表

表的載入我就不寫了，比較簡單， 大概寫一下需要的按鈕和html部分就可以了

<button type="button" class="btn btn-primary"  id="plscdz" >大量刪除</button>

全選：

<input type="checkbox" id="cq"/>

遍曆出來的複選框為

<input type="checkbox" value="{$v[0]}" class="cq"/>

首先是全選按鈕點擊之後可以把遍曆的複選框全部選中

<script type="text/javascript"> $("#cq").click(function(){$(".cq").prop("checked",$(this).prop("checked"));})</script>

這裡我唯寫了一個簡單的模態框

<p class="modal fade" id="myModal11" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">          <p class="modal-dialog">            <p class="modal-content">              <p class="modal-header">                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">                  ×                </button>                <h4 class="modal-title" id="myModalLabel">                  提示                </h4>              </p>              <p id="qrnr1" class="modal-body">                您將刪除選中的圖書！              </p>              <p class="modal-footer">                <button id="qxplsc" type="button" class="btn btn-default" data-dismiss="modal">取消刪除</button>                <button id="qrplsc" type="button" class="btn btn-primary">確認大量刪除</button>              </p>            </p><!-- /.modal-content -->          </p><!-- /.modal -->        </p>      </p>

這樣前端的內容就完成了，這樣就開始寫js部分了，我全部用的是jquery

var chk = "";  var check2 = "";  //判斷多個複選框中的某一個是否被實現  function checked(){    var count = 0;    var checkx = $("#cq");    if(checkx.checked)    {      check2=1;//選中全選按鈕    }    else    {      check2=0;//沒選中全選按鈕    }    var checkArry = $(".cq");    for (var i = 0; i < checkArry.length; i++)    {      if(checkArry[i].checked == true)      {        //選中的操作        count++;      }    }    if( count == 0 )    {      chk=0;//沒有選中項    }    else    {      chk=1;//有選中項    }    //alert(chk);  }  function plscdzxx()  {    //大量刪除    $("#plscdz").click(function(){      checked();      if(chk==1 || check2==1){// 提交        $('#myModal12').modal('show');        $("#nqrplsc").click(function(){/*給確認刪除按鈕加事件*/          $('#myModal12').modal('hide');          //找選中的主索引值，用迴圈遍曆選中的主索引值          var cq =$(".cq");          var plstr ="";          for(var i=0;i<cq.length;i++)          {            if(cq.eq(i).prop("checked"))            {              plstr+=cq.eq(i).val()+"','";            }          }          plstr= plstr.substr(0,plstr.length-3); //分隔字元佔3個字元，截取字串，去掉最後的"','"，這樣正好匹配SQL語句          $.ajax({            async:false,            url:"plscdz.php",            data:{plstr:plstr},            dataType:"TEXT",            type:"POST",            success:function(data){              if(data.trim()=="OK")              {                alert("刪除成功");                nload();  //在這裡要重新載入一遍頁面              }              else              {                alert("刪除失敗");              }            }          });        });      }      else if(chk==0)      {        // 不提交        //alert(chk);        alert("請選擇您要刪除的內容");      }    })  }

ajax會串連到大量刪除的處理頁面 ，下面就是大量刪除的處理頁面了

<?phpsession_start();include("DBDA.class.php");$db = new DBDA();if(!empty($_POST["plstr"])){  $plstr = $_POST["plstr"];  $sql = "delete from maninfo where id in ('{$plstr}')";  if($db->Query($sql,0))  {    echo "OK";  }  else  {    echo "NO";  }}

寫到這兒 如果您要是自己嘗試的話，可能不運行，這就需要把大量刪除的方法給調一下，前面有載入的方法的話，那就直接把大量刪除的方法寫到載入方法裡面調用就可以了