添加一個關閉按鈕切換框js

Question

我想在此切換框的底部添加一個關閉按鈕。請有人幫我處理劇本嗎？謝謝。

<td> 
    <a href="javascript:void(0)" class="heading">Business Management in the Global Economy <small>(2+2 Program)</small></a> 
    <div class="info-hidden info" style="height:380px;"> 
     <p> 
     <b>Program Description:</b><br /> 
     Some Text....... 
     <br /> 
     <a href="/programs/bachelors-in-business-management-in-the-global-economy.php" class="nudge"> 
      <b>Learn More &#9658;</b> 
      <a class="close" href="javascript:void(0)">Close &#9746;</a> 
     </a> 
     </p> 
    </div> 
    </td> 

腳本看起來像這樣 - 很簡單。

// slide toggle 
    $(".info").hide(); 
    //toggle the componenet with class msg_body 
    $(".heading").click(function() 
    { 
     $(this).next(".info").slideToggle(300); 
    }); 

Answer 1

$('a.close').click(function(e){ 
    e.preventDefault(); 
    $(this).parents('div.info-hidden.info').slideToggle(); 
}); 

jsFiddle example。

Answer 2

我用這個....

// slide toggle 
$(".info").hide(); 
//toggle the componenet with class msg_body 
$(".heading").click(function() { 
    $(this).next(".info").slideToggle(400); 
}); 
$(".closeToggle").click(function() { 
    $(this).parent(".info").slideToggle(); 
});