Thinkphp와 jquery를 기반으로 Ajax 다중 선택, 역선택, 데이터 삭제 기능을 구현합니다.

이 글에서는 php(Thinkphp) + jquery 기반의 ajax 다중 선택, 반전, 삭제 기능 구현에 대한 관련 정보를 주로 소개합니다. 필요하신 분들은 참고하시면 됩니다.

js 기초를 가지고 있는 것을 권장하며, jquery와 thinkphp를 이해하세요. 말도 안되는 소리는 하지 마세요.

//thinkphp循环显示把data里fid赋予多选框
<volist name="data" id="vo">
<tr>
   <td><input type="checkbox" value="{$vo.fid}"/></td>//可在后面加td输入参数  
</tr>
</volist>
<tr>
<th width="80"><input type="checkbox" id="all"/>全选</th>
<th width="80"><input type="button" value="全选" class="btn" id="selectAll" /></th>
<th width="80"><input type="button" value="全不选" class="btn" id="unSelect" /></th>
<th><input type="button" value="反选" class="btn" id="reverse" /></th> 
<th width="180">
 <a href="javascript:void(0);" rel="external nofollow" onclick="del()" title="删除选定数据">删除</a>
</th> 
</tr>

《————PHP—— ——》

<script>
    //多选
    $("#all").click(function(){   
    if(this.checked){   
        $("#list :checkbox").attr("checked", true);  
      }else{   
        $("#list :checkbox").attr("checked", false); 
      }   
    });
    //当点到全选按钮
    $("#selectAll").click(function () { 
      $("#list :checkbox,#all").attr("checked", true);  
    });
    //全不选
    $("#unSelect").click(function () {  
      $("#list :checkbox,#all").attr("checked", false);  
    });
    //反选
    $("#reverse").click(function () {  
      $("#list :checkbox").each(function () {  
        $(this).attr("checked", !$(this).attr("checked"));  
      }); 
      allCheck(); 
    });
    //删除
    function del(){
      var valArr = new Array;
      $("#list :checkbox[checked]").each(function(i){ 
        valArr[i] = $(this).val(); 
      });
      var vals = valArr.join(&#39;,&#39;);//数组转换以逗号隔开的字符串 
      if (valArr.length == 0) {
        alert(&#39;请选择要删除的选项&#39;);
      }else{
        if (confirm("确定删除？删除后将无法恢复。")){
          var data={name:vals};
          $.ajax({
            type: "post",
            url: "{:U(&#39;College/School/faculty_del&#39;)}",//url为tp方法（控制器/方法）
            data:data,
            success: function(json) {
             var obj = eval(&#39;(&#39; + json + &#39;)&#39;);//返回回来的json转化为js对象
              if (parseInt(obj.counts) > 0) {
                alert(obj.des);
                location.reload();
               } else {
                alert(obj.des);
               }
              },
            error: function(XMLHttpRequest, textStatus) {
               alert("页面请求错误，请检查重试或联系管理员！\n" + textStatus);
             }
           });
        }
      }
    }
</script>

비동기식이므로 전송한 데이터는 콘솔에 표시되므로 현재 페이지에는 출력이 없으므로 하지 마세요. 그것을 찾기 위해 페이지로 이동하지 마십시오.

위 내용은 이 글의 전체 내용입니다. 모든 분들의 학습에 도움이 되었으면 좋겠습니다. 더 많은 관련 내용은 PHP 중국어 홈페이지를 주목해주세요!

관련 권장사항:

thinkPHP3.2.3은 Laypage와 결합하여 페이징 기능을 실현합니다

ThinkPHP와 Ajax는 보조 연결 드롭다운 메뉴를 실현합니다

anti-ajax push를 기반으로 PHP는 실시간 메시지 푸시 기능

위 내용은 Thinkphp와 jquery를 기반으로 Ajax 다중 선택, 역선택, 데이터 삭제 기능을 구현합니다.의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!