javascript - 调用方法来展开和折叠部分

Question

我正在使用Simple-Expand http://redhotsly.github.com/simple-expand/展开和折叠 HTML 页面中的部分。

jQuery代码：

$(function () {
    $('.hello').simpleexpand();

});

$(function () {
    $('.bye').simpleexpand();

});

HTML：

<a href='' id='hello' class='hello'> Hi  </a>

            <a href='' id='bye'  class='bye'> Bye  </a>

分区：

<div class="content">
  Hello
</div>

<div class="content">
  Bye
</div>

当我单击带有类的链接时，应该只调用带有文本hello的标签，当我点击链接时，应该显示带有文本的标签。我怎样才能做到这一点 ？DIVHelloByeDIVBye

Answer 1

这一切都在您发布的文档中：http: //sylvain-hamel.github.io/simple-expand/

您必须在调用该simpleexpand方法时指定选项

例如 ：

$(function () {
    $('.hello').simpleexpand({'defaultTarget': '.helloDiv'});

});

$(function () {
    $('.bye').simpleexpand({'defaultTarget': '.byeDiv'});

});

和你的 html ：

<div class="helloDiv">
  Hello
</div>

<div class="byeDiv">
  Bye
</div>

Answer 2

尝试这个：

jQuery代码：

$(function () {
    $('a').click(function(){
        var id = $(this).attr('id');
        var divId = 'div_' + id;
        $('#'+divId).simpleexpand();
     });
});

HTML：

<a href='' id='hello'class='hello'> Hi  </a>
<a href='' id='bye' class='bye'> Bye  </a>

分区：

<div class="content" id='div_hello'>
  Hello
</div>

<div class="content" id='div_bye'>
  Bye
</div>