jQuery로 빈 HTML 테이블 행을 반복하고 삭제하십시오.

jQuery를 사용하여 HTML 테이블을 반복하고 비어있는 행을 삭제하려고합니다. 페이지가 ASP.NET에 의해 구동되고 특정 권한이 있으면 테이블의 항목이 숨겨집니다. 따라서이 스크립트를 만들어 빈 행을 제거하고 여전히 표시되는 다른 항목 사이의 공간을 없애기를 원했습니다. 나는 현재 실행해야하는 것을 얻을 수없는 것처럼 보입니다. 왜 그런지 확신 할 수 없습니다. 코드는 다음과 같습니다.jQuery로 빈 HTML 테이블 행을 반복하고 삭제하십시오.

<script src="http://code.jquery.com/jquery-1.5.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     $('tr').each(function() { 
      $(this).find('td').each(function() { 
       if ($(this).text().trim() == "") { 
        $(this).closest("tr").remove(); 
       }; 
      }); 
     }); 
    }); 
</script>

모든 안내가 크게 감사하겠습니다. 감사!

출처

2011-03-31 StephenDebs

이 쉽게 처리하지 않을까요 서버 측? –

이 서버 측 처리는 테이블 렌더링 방법에 따라 다릅니다. 테이블이 동적으로 생성되는 경우 원하지 않는 HTML을 "방출"하지 않도록 코드를 수정하십시오. 데이터 바인딩 된 컨트롤을 사용하여 테이블을 생성하는 경우 데이터 소스를 수정해야 할 수 있습니다. 테이블이 페이지의 정적 HTML이면 클라이언트 측 솔루션에 문제가있을 수 있습니다. –

테이블은 정적 HTML이고 page_load 이벤트는 테이블을 채우는 링크를 결정합니다 ... 권한있는 탐색을 수행하는 것은 나쁜 방법이지만이 시점에서 그걸로 붙어 있습니다. – StephenDebs

코드가 올바르게 작동하는 것 같습니다.

<html> 
<head> 
    <title>jQuery Tests</title> 

    <script src="http://code.jquery.com/jquery-1.5.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $('tr').each(function() { 
       $(this).find('td').each(function() { 
        if ($(this).text().trim() == "") { 
         $(this).closest("tr").remove(); 
        }; 
       }); 
      }); 
     }); 
    </script> 

</head> 
<body> 
    <table cellpadding="0" cellspacing="0" border="1"> 
     <tr> 
      <td></td> 
      <td>testing</td> 
     </tr> 
     <tr> 
      <td>testing</td> 
      <td>testing</td> 
     </tr> 
     <tr> 
      <td>testing</td> 
      <td> </td> 
     </tr> 
    </table> 
</body>

는 충돌 할 수있는 페이지에 다른 뭔가가있을 수 : 실행 해보십시오 내가 무엇을 의미하는지에 관해 알기 위해 스스로 다음? 경우에 문제

출처

2011-03-31 15:07:59

질문에서 OP는 "특정 허가가 있으면 테이블의 항목이 숨겨집니다"라고 언급합니다. 세포가 실제로 비어있는 것은 아닌지, 디스플레이 대신 스타일이 지정되었는지 궁금하다. 아무 것도 아니다. –

ASP 하이퍼 링크를 숨기는 페이지로드 이벤트가 있습니다. 그 대신 ASPX 페이지가 빈 셀로 생성됩니다. "" – StephenDebs

호기심에서이 페이지를 테스트하는 브라우저는 무엇입니까? 나는이 코드가 IE에서는 실패하지만 FireFox에서는 잘 작동하는 것으로 나타났습니다. 주위에 놀고 후, 그것은 IE에서 귀하의 조건 내에서 trim() 함수 문제가있는 것 같습니다. $ .trim ($ (this) .text()) –

'tr'태그는 항상 'td'태그의 다음 부모이기 때문에 '.parent()'메서드를 사용하는 것이 더 좋습니다.

출처

2011-03-31 15:05:01 reporter

이을 시도했다

var td = $(this).find('td:empty'); 
if (td.length > 0) $(this).remove();

http://api.jquery.com/empty-selector/

, 당신은 정말 서버 측에서이 작업을 수행 할 수. 문서 준비 이벤트가 시작될 때까지 빈 행을 처리해야하기 때문에 클라이언트 측에서보기 흉하게 보일 것입니다.

출처

2011-03-31 15:06:05

나는이 단축 답변을 좋아하지만 실행하면 여전히 내 테스트 페이지의 단추 사이에있는 공간을 제거하지 못합니다. 나는 두 개의 버튼이있는 테이블을 가지고 있습니다. 하나는 상단에, 하나는 하단에, 많은 빈 행이 중간에 있습니다. 나는 그것을 국부적으로 돌리고있다, 저것은 문제점인가? – StephenDebs

이 답변은 1 줄 $ ('table')로 단축 할 수 있습니다. find ('tr : empty'). remove(); –

리드 우리는 오직 TD 비어있는 다른 모든 TD 내가 코드가 고려 이것을 만들기 위해 변경 해요

을 가득

<script type="text/javascript"> 
     $(document).ready(function() { 

      $('tr').each(function() { 
       var totalTDs = $(this).find('td').length; 
       var emptyTDS = 0; 

       $(this).find('td').each(function() { 
        if ($(this).text().trim() == "") { 
         emptyTDS += 1; 
        }; 
       }); 

       if (emptyTDS == totalTDs) { 
        $(this).remove(); 
       } 
      }); 
     }); 
    </script>

출처

2013-04-03 10:18:54

감사합니다. _ 오래된 게시물 인 것을 압니다. 그러나 이것은 큰 시간을 절약합니다! _ _ –

jQuery로 빈 HTML 테이블 행을 반복하고 삭제하십시오.

답변

관련 문제