Question

我有一个页面可以查询所选日历日期的事件，并将它们分组到每个不同事件类型的单个表中。

显然这个列表可能会变得非常大而不是显示所有内容而用户必须滚动很多我希望我可以使用切换功能在单击表标题时隐藏事件类型的事件列表那个事件类型。

我正在努力解决的问题是我不知道任何选定日期会有多少种不同的事件类型，那么我该如何编写一个只隐藏所选事件类型的函数？

Answer 1

你的问题并没有给我们太多的帮助，所以也许我完全没有这个答案。

但我认为您需要在表示事件的元素中添加event-type属性，然后您可以使用jQuery选择元素并应用切换。

<style>
display-none { display:none; }
</style>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
$().ready(function () {

    $('div[event-type]').toggle('display-none');

    $('div[event-type-header]').bind('click', function () {
        var eventType = $(this).attr('event-type-header');
        $('div[event-type="' + eventType + '"]').toggle('hide-event-type');
    });
});
</script>

<!-- header -->
<div event-type-header="party">toggle party</div>
<div event-type-header="auction">toggle auction</div>

<!-- content -->
<div event-type="party">party1</div>
<div event-type="auction">auction1</div>
<div event-type="party">party2</div>
<div event-type="auction">auction2</div>

JQuery切换未知数量的表

1 个答案: