크기 변경시 jQuery 높이()가 변경되지 않음

Question

이전에는이 ​​문제가 없었지만 해결책을 찾지 못하는 것 같아서 저를 도와 줄 수 있기를 바랍니다.

이 기능이 무엇 jQuery를

function setTheHeight() { 

    if($('#main.level1 .block.attention .block-content').length) { 
     //Get value of highest element 
     var maxHeight = Math.max.apply(Math, $('#main.level1 .block.attention .block-content').map (
      function() { 
       return $(this).height(); 
      } 
     )); 
     console.log(maxHeight); 
     $('#main.level1 .block.attention .block-content').height(maxHeight); 
    } 
} 

setTheHeight(); 

$(window).resize(function() { 
    setTheHeight(); 
}); 

Basicly이 높이로 선택한 모든 사업부의의의 높이를 가장 높은 사업부를 확인하고 설정합니다. 이것은 잘 작동합니다. 하지만 반응 형 디자인이므로 사용자가 브라우저의 크기를 조정하면 콘텐츠가 작아지고 div가 높아집니다. 그래서 크기 조정 이벤트를 추가했습니다. 이벤트가 시작되었지만 높이가 변경되지 않았습니다. 크기를 조정해도 높이가 변하지 않는 이유는 무엇입니까? 무슨 보여

빠른 jsFiddle : http://jsfiddle.net/3mVkn/

FIX는

흠이 그냥 일반 바보. 높이를 설정했기 때문에 이미 고쳐 졌으므로 높이를 재설정하면 효과가있었습니다.

업데이트 코드 :

function setTheHeight() { 

    if($('#main.level1 .block.attention .block-content').length) { 

     //Reset height 
     $('#main.level1 .block.attention .block-content').height('auto'); 

     //Get value of highest element 
     var maxHeight = Math.max.apply(Math, $('#main.level1 .block.attention .block-content').map (
      function() { 
       return $(this).height(); 
      } 
     )); 
     console.log(maxHeight); 
     $('#main.level1 .block.attention .block-content').height(maxHeight); 
    } 
} 

setTheHeight(); 

$(window).resize(function() { 
    setTheHeight(); 
}); 

Answer 1

jQuery와 관련된 것이 아니라 CSS입니다. 일단 블럭 내용의 높이를 약간의 값으로 설정하면 윈도우의 크기를 변경 한 후에 더 이상 높이가 auto이 아닌 미리 정의 된 값으로 설정되기 때문에 블럭 내용의 높이가 변경되지 않기 때문입니다.

해결책은 return $(this).height() 대신 대신에 return $(this)[0].scrollHeight을 사용하는 것입니다. 이렇게하면 CSS 정의 높이가 아닌 내용의 실제 높이가 반환됩니다.

편집 :

이 솔루션은 .block 콘텐츠 내부의 모든 아이들의 높이를 계산하고, 그 다음에 그 값을 반환하는 사실이다. 여기에 코드를 편집했습니다 http://jsfiddle.net/3mVkn/12/

이렇게하면 필요한 결과를 얻을 수 있습니다.

Answer 2

난 당신이 .map() 기능을 하나 개의 매개 변수를 누락 생각합니다. 나는 보았다 .map()here.