2017-12-30 52 views
1

JQuery와 .hide & .show 공간도 당신이 볼 수 있듯이 내</b><b>.request 행</b> 있지만 아래로 언제가는 .show 그때 <b>을 요청을 선택하면,

<script async src="//jsfiddle.net/andersonkoh/y6s9esnh/2/embed/"></script>

숨길 수있다 차지 오른쪽 클릭> 브라우저에서 검사를하면 . 문의 - 행이 숨겨져 있지만 공간을 차지하고 있음을 보여줍니다. 어떻게 그것을 아래로 밀어 내리지 않고 동일한 라인에서 만들 수 있습니까?

+0

이 Subash 내 문제를 해결 탐구 행 –

+0

힐로 @MrHery의 패딩과 마진을 제거 시도하고 그가 명확하게 설명이다. 어쨌든 고마워! –

답변

1

이것은 요소의 공간을 사용하여 <div class="col col-6"><div id="enquiry-row" style="display:none;"></div></div> 안에 숨겨진 요소를 숨기지 않고이 자체를 <div class="col col-6">으로 숨겨야합니다.

이렇게하면 <div class="col col-6" id="enquiry-row" style="display:none;"><div></div></div>이됩니다. 여기

JSFIDDLE

+0

Helo @Subash. 너는 내 문제를 해결해. 고맙습니다. 나는 1 가지 더 묻고 싶다. 내가 "요청"인 두 번째 옵션을 선택하고 "문의"의 마지막 결과 인 전자 피드백 양식을 숨기려고 할 때 .show로 갈 것입니다. 이 내가 무슨 짓을 : \t \t'$ ('#의 selectOptions') ('변화', 기능() { \t \t 경우 ($ (이) .val() === "옵션-2. ") { \t \t $ ("# 요청 행 "). 쇼()을 $ (". 즉 귀환 형 그룹 ").) ( \t \t 숨기한다} else \t \t을 { \t \t $ ("# request-row"). hide() \t \t} \t \t}); ' 하지만 작동하지 않습니다. –

+0

@AndersonKoh를 시도해보십시오. https://jsfiddle.net/y6s9esnh/6/. – Subash

+0

헬리콥터. 나는 그것을 해결한다. '

'하고 스크립트에 문의 결과가 될 것입니다 난 그냥 그룹 \t \t'$ ('#의 selectOptions'). ('변화', 기능() { \t \t 경우 ($에 (이) .val() === "옵션-2") { \t \t $ ("# 요청 행"). 쇼() \t \t \t $ ("# 탐구 결과"). 숨기기() \t \t} \t \t else { \t \t $ ("# request-row") hide() \t \t \t \t})'물론, $ ("# inquiry-results"). show()'를 추가하면 'Enquiry'가 선택되었을 때 다시 보여줍니다! –