jquery - Div 切换器 - 切换当前 div 事件描述

标签 jquery toggle

首先,我需要说我是 jQuery 的初学者,我的 HTML/JS 类(class)需要它。所以这就是我需要做的

    <div class="event">
    <div class="event-bar">
        <table cellspacing="0" cellpadding="0">
            <tr>
                <td class="space" colspan="7">
            </tr>
            <tr>
                <td class="event-date"><p>22 IV</p></td>
                <td class="event-place">19.30<br/>Kościół Księży Misjonarzy</td>
                <td class="event-doc">carte blanche</td>
                <td class="event-title">johann sebastian bach<br/>Pasja wg św. Mateusza</td>
                <td class="event-performers">Anna Schoek<br/>Stefan Telefan<br/>Lorem Ipsum</td>
                <td class="event-leader">dyrygent</td>
                <td class="event-toggler"><div class="toggler"></div></td>
            </tr>
            <tr>
                <td class="space" colspan="7">
            </tr>
        </table>
    </div>
    <div class="event-description">
        <p>...</p>
    </div>
</div>

我需要实现的是div。按下时应切换 div 的切换器。 event-description,有X个div.event。每次单击 div 时。切换器应仅切换当前 div 事件描述,并在其他打开时隐藏其他(一次切换一个)。

我真的无法与 .parent() 争夺 table 外面。

最佳答案

创建一个新的 css 类 - 隐藏: 然后在CSS中:

.hidden {display:none;}

jquery:

 $(document).ready(function () {
        $('.toggler').click(function () {
            $('.event-description').addClass('hidden');
            $(this).parents('.event:first').find('.event-description').removeClass('hidden');
        });
    });

应该这样做。

关于jquery - Div 切换器 - 切换当前 div 事件描述,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6136038/

相关文章:

jquery - 当我点击jquery中的数据表插件中的分页时如何设置事件

javascript - 触发按钮单击文本框中的 Enter 键丢失其值

tinymce 切换问题

javascript - JQuery 测试元素是否可见或隐藏,然后添加删除类

javascript - "selecting all"复选框切换的 onClick 按钮功能

php - 使用 php 更新 json

jquery - Bootstrap 4 activate.bs.scrollspy 事件未触发

javascript - 如何分别切换多个div的可见性

jquery - 关闭切换后无法滚动正文

javascript - cropper.jscant 通过 blueimp 初始化 blob 图像 <img> 标签