Question

我试图使用jquery的切换来隐藏/显示在for循环中的div。当我单击按钮进行切换时，div会快速滑出，但随后会再次隐藏。当发生这种情况时，切换按钮几乎似乎被禁用以进行下一次点击...然后再次使用相同的有问题的div显示。我使用了{{email.sender}}模板值，因为当我点击切换按钮时，列表中的所有项目都将被激活，而不是仅激活那个项目。下面的代码插入到带有Jquery的选项卡中（此部分正在运行）。感谢您对此提出的任何建议 -

<div id="email_received_list">
    {% for email in email_received_list %}
        <p>
            <input type="button" id="{{email.sender}}" value="Show Message">      {{email.sender}}:  {{ email.subject }} 
        </p> 
    <script>
        $(document).ready(function(){
            $('#{{email.sender}}').click(function() {
                $('.{{email.sender}}').slideToggle('fast');
                return false;
            });
        }); 
    </script>       
    <div class="{{email.sender}}" style="display:none; background-color:#4CF;width:100%;height:100%;"></div>

    {% else %}
        (You have not received any messages yet.)   
    {% endfor %}

Answer 1

好吧，我对这个感觉很愚蠢 - 但是一旦我向div添加了一些实际内容（不只是尝试为方块着色），它运行正常。我想因为它是在一个循环中，它试图调整div匹配内容的大小。当没有内容时，div再次隐藏自己。如果您对此有所了解，请告诉我 - 谢谢。

jquery使用Jinja2模板在for循环中切换

1 个答案: