모두 선택 확인란 페이지 매김 도움말 필요

Question

현재 페이지 당 10 개의 레코드를 표시하는 페이지 매김이있는 보고서가 있습니다.

이 보고서에는 모든 레코드에 대한 확인란 열도 있습니다. 이것에 기초하여

"모두 확인"기능을 통합하고자하므로 10 개의 레코드를 표시하는 시나리오에 따라 "모두 선택"체크 상자를 누르면 모든 보이는 레코드를 확인하고 싶습니다. 해당 페이지 (pageno = 3)에서 10 번 레코드를 삭제 한 후에는 같은 페이지 번호 (pageno = 3)로 동일한 페이지 (filename.php)로 리디렉션되어야합니다.

이 자바 스크립트를 사용하여 해결할 수

Answer 1

www.example.com/filename.php?pageno=3. 확인란의 이름은 어떻게 정의합니까?

for 루프를 사용하면 현재 표시된 모든 확인란의 상태를 변경할 수 있습니다.

jQuery와 같은 자바 스크립트 툴킷/프레임 워크를 사용하는 경우 매우 간단합니다.

$(".page-[NUM]").each(function() 
{ 
this.checked = checked_status; 
}); 

을 또는 당신이 페이지의 각 체크 박스에 같은 이름을 사용하는 경우, 시도 : 당신이 .page- [NUM] 다음 페이지에있는 모든 체크 박스와 클래스를 줄 수있는 예를 들어 사용

$("input[@name=thename]").each(function() 
{ 
this.checked = checked_status; 
}); 

"thename"은 해당 페이지의 확인란 이름입니다.

Answer 2

jQuery와 같은 일부 프레임 워크를 사용하면 훨씬 쉽게 작업 할 수 있습니다.

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#chkAll").change(function(){ 
      if($("#chkAll").is(":checked")){ 
       $("#report tr td:first-child").find("input:checkbox") 
         .attr("checked","checked"); 
      }else{ 
       $("#report tr td:first-child").find("input:checkbox") 
         .attr("checked",""); 
      } 
     }); 
    }); 
</script> 

편집 : 다음 필요한 할 것

<table id="report"> 
    <tr><td> <input type="checkbox" id="tr1" /></td><td>..</td><td>...</td></tr> 
    <tr><td> <input type="checkbox" id="tr2" /></td><td>..</td><td>...</td></tr> 
    <tr><td> <input type="checkbox" id="tr3" /></td><td>..</td><td>...</td></tr> 
    <tr><td> <input type="checkbox" id="tr4" /></td><td>..</td><td>...</td></tr> 
    <tr><td> <input type="checkbox" id="tr5" /></td><td>..</td><td>...</td></tr> 
</table> 

<input type="checkbox" id="chkAll"/> Select All. 

다음 코드 (jQuery를 사용하여) : 가정 다음은 레코드의 구조 - 당신의 코드를 기반으로, 당신의 boxes_checkall 기능을 대체하려고 이 코드;

함수 boxes_checkall (a, b) { VAR a.getElementsByTagName CBS = ('입력');

 for(var i=0;i<cbs.length;i++) 
     { 
      if(cbs[i].type.toLowerCase()=='checkbox') 
      { 
       cbs[i].checked = b==1; 
      } 
     } 
    } 
</script>