재배치 div의 클릭 위치에 따라

Question

여러 개의 동일한 숨겨진 형태를 포함하는 페이지, 각과 같은 별도의 숨겨진 DIV에 포함되어 있습니다 : 모든 이들의하는 대신

<div class="product-intro-text">Some text.... 
    <div class="rfq-button"><a class="advantage-button" id="Adapters" href="#">Request a Quote</a></div> 
    <div class="inline-rfq"> 
      <form class="contact" name="contact" action="#" method="post">...</form> 
    </div> 
</div> 
<div class="h-sep"></div> 
<div class="product-intro-text">Some text.... 
    <div class="rfq-button"><a class="advantage-button" id="Auger&nbsp;Equipment" href="#">Request a Quote</a></div> 
    <div class="inline-rfq"> 
      <form class="contact" name="contact" action="#" method="post">...</form> 
    </div> 
</div> 

:

HTML을 동일한 숨겨진 DIV를 .inline-RFQ DIV의 위치를 ​​클릭하여 해당 .rfq-button 아래에 표시 할 수 있습니까? 이것은 모바일 사이트 용이므로 솔루션은 모바일 친화적이어야합니다. 사전에 도움을

jQuery(document).ready(function($){ 
/* toggle form */ 
$(".rfq-button").on("click", function(){ 
    $(this).next().slideToggle(); 
    $(".inline-rfq").next().toggleClass("display"); 
}); 
}); 

감사 : 이미 여기 페이지의 나머지 부분 JS/jQuery를 사용하고있어

숨겨진 DIV를 드러내는 JS이다.

Answer 1

다음은 바이올린입니다. http://jsfiddle.net/psyon001/ejdgX/ 새 섹션 아래에 표시 할 때 양식 상태를 다시 설정하는 것이 좋습니다.

jQuery(document).ready(function($) { /* toggle form */ 
    $(".rfq-button").on("click", function() { 
     var $thisParent = $(this).closest('.product-intro-text'), 
      $form = $(".inline-rfq"); 
     if ($thisParent.find('.inline-rfq').length) { 
      $form.slideToggle(); 
     } else { 
      $form.slideUp(function() { 
       $form.appendTo($thisParent).slideDown(); 
      }); 
     } 
    }); 
});​