Question

我对JQuery很新，但我正在尝试将JQuery手风琴用于页面上的信息。它没有像我预期的那样显示，所以我用Chrome来检查div标签。 element.style在活动选项卡上设置为0px的高度，所以我甚至看不到该div中的内容。当我扩展手风琴中的其他div时，突然所有div都高度为0.39999961853027344px（即使是第一个）。

我没有将任何风格应用于手风琴控制或其中的div，所以我不确定为什么Chrome会在element.style中显示这些幻影高度。

            <div id="accordion">
            <h3>Alerts</h3>
                <div>
                        <asp:GridView runat="server" ID="myRelatedGV1" AutoGenerateColumns="true" />
                </div>
            <h3>Information</h3>
                <div>
                    123
                </div>  
            <h3>Conditions</h3>
                <div>
                    456
                </div>
            <h3>Assignments</h3>
                <div>
                    789
                </div>
        </div>
        <script>
            $("#accordion").accordion();
        </script>

正如你所看到的，我没有将任何css应用于其中div的手风琴div。

根据Chrome的手风琴中的open div的初始风格： element.style { 身高：0px; }

根据Chrome浏览器扩展事件后手风琴中的所有div：

element.style {
    height: 0.39999961853027344px;
    overflow: hidden;
    display: block;
    padding-top: 14.300000190734863px;
    padding-bottom: 14.300000190734863px;
}

根据Chrome的说法，HTML最终看起来像这样：

#accordion > div.SettingsWrapper.ui-accordion-content.ui-helper-reset.ui-widget-content.ui-corner-bottom.ui-accordion-content-active


<div class="SettingsWrapper ui-accordion-content ui-helper-reset ui-widget-content ui-corner-bottom ui-accordion-content-active" role="tabpanel" style="height: 0.39999961853027344px; overflow: hidden;     display: block; padding-top: 14.300000190734863px; padding-bottom: 14.300000190734863px;">
<div>
    <table cellspacing="0" rules="all" border="1" id="MainContent_myRelatedGV1" style="border-collapse:collapse;">
    <tbody>
        //...data...
    </tbody>
    </table>
</div>
</div>

我逐一评论了chrome中html中引用的每个样式类，但它没有任何效果。并且这些类中没有一个具有0或0.39999961853027344的高度。我无法弄清楚这些价值来自哪里。

Answer 1

参见 FIDDLE

如果您未在手风琴初始化中传递heightStyle: "content"选项，默认情况下，它会将所有手风琴高度设置为等于第一个DIV的高度。

含义：如果您没有设置DIV，则所有其他DIV将自动为零。

查看jQuery Accordion Widget上的this帖子。

没有内联样式时的element.style

1 个答案: