使用带表格列的jquery手风琴

时间:2013-05-01 09:45:40

标签: javascript jquery jquery-ui accordion jquery-ui-accordion

我可以以某种方式使jQuery UI Accordion与html表兼容吗?我已经尝试了一切使列可折叠。

知道我已经完成了这个

$(".col1, .col2").addClass("hidden");

$(".show-hide-col1").css("cursor", "pointer").click(function() {
    $(".col2").addClass("hidden");
    $(".col1").removeClass("hidden");
});

$(".show-hide-col2").css("cursor", "pointer").click(function() {
    $(".col1").addClass("hidden");
    $(".col2").removeClass("hidden");
});

但它并不像jquery手风琴那么聪明。

1 个答案:

答案 0 :(得分:0)

<强> HTML

<table width="50%" border="1px solid red">
    <tr><td class="col1">Col1</td><td class="col2">Col2</td></tr>
</table>
<button class="show-hide-col1">Hide col1</button>
<button class="show-hide-col2">Hide col2</button>

<强> SCRIPT

$(document).ready(function(){
    $(".show-hide-col1").click(function() {
        $('.col1').hide();
    });

    $(".show-hide-col2").click(function() {
        $('.col2').hide();
    });
});

小提琴 http://jsfiddle.net/DZ3WB/2/