添加关闭按钮以切换框js

时间:2012-06-15 17:03:33

标签: jquery

我想在此切换框的底部添加一个关闭按钮。有人可以帮我写一下这个剧本吗?感谢。

  <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);
  });

2 个答案:

答案 0 :(得分:0)

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

<强> jsFiddle example

答案 1 :(得分:0)

我用过这个......

// 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();
});