通过单击另一个更改html标记的样式 [英] Changing the style of html tag by clicking on another

问题描述

我有以下代码，parentAppliance是主左导航表的一部分，并悬停在设备我看到一个包含健康的子表。现在，当我点击健康和任何想法时，我想让子表单消失？

I have the following code, the parentAppliance is part of main left nav table and on hovering over "Appliance" I see a subtable containing "health". Now I want the subtable to disappear when I click on health, any thoughts?

CSS：

.childAppliance
    {
        display:none;
    }
.parentAppliance:hover .childAppliance
    {
        display: block;
        top: 50px;
        left: 130px;
    }

HTML：

<li id="Appliance" itemid="Appliance" class="parentAppliance" role="presentation">
    <a href="#/appliance_status.home" hiddentitle="Appliance" id="ui-id-83" class="ui-corner-all" tabindex="-1" role="menuitem" aria-haspopup="true" title="" data-original-title="">
        <span class="ui-menu-icon ui-icon ui-icon-carat-1-e"></span><ins class="ui-navigation-static-menu-icon ui-navigation-static-menu-icon-backup"></ins>
        <span class="ui-navigation-static-menu-text" style="display: inline;">Appliance</span>
    </a>
    <ul id="ApplianceSubTable" class="ui-menu ui-widget ui-widget-content ui-corner-all childAppliance" role="menu" aria-hidden="true" aria-expanded="false" aria-labelledby="ui-id-83">
        <li itemid="Health" class="ui-menu-item" role="presentation">
            <a href="#/appliance_status.home" hiddentitle="Health" id="ui-id-33" class="ui-corner-all ui-state-focus applianceFocus" tabindex="-1" role="menuitem" title="">
                <span class="ui-navigation-static-menu-text">Health</span>
            </a>
        </li>
    </ul>
</li>

推荐答案

使用：active将显示设置为无。 / p>

Use :active to set display back to none.

.ui-navigation-static-menu-text:active{
    display:none;
}

http://jsfiddle.net/vXU2t/

这篇关于通过单击另一个更改html标记的样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！