【问题标题】:issue when remove display:none with JQuery删除显示时出现问题:JQuery 无
【发布时间】:2010-10-13 10:26:54
【问题描述】:

我正在使用 Jquery 按钮集,它内置在 Jquery UI 中。还有一个 ui 插件的 selectmenu。

.buttonset();获取一组按钮并将它们变成单选按钮 .selectmenu();获取一个选择菜单并将其转换为一个漂亮的弹出列表。

但是,当我将这些项目放置在具有属性 display:none 的 div 中,然后在我的 javascript 代码中删除 display:none 时,按钮集没有圆角,并且选择菜单显示大约 2 px 宽,虽然我仍然可以点击这两个像素来打开菜单。

有什么想法吗?我将发布我的代码:

.hidden
{
    display:none;
}


        $("#test").selectmenu();
        $("#radioset").buttonset();

<div id="mydisplay" class="hidden">
    <div id="radioset">
                        <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1testetstes</label>
                        <br /><input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
                        <br /><input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
                    </div>
    <select name="test" id="test">
            <option value="slow">Test1</option>
            <option value="test2">Test2</option>
            <option value="test3">Test3</option>
            </select>
</div>

在某些时候我称之为:

$("#mydisplay").removeClass("hidden");

但是对象没有正确显示...我可以强制它们重新渲染吗?

【问题讨论】:

    标签: javascript jquery html


    【解决方案1】:

    不要删除将元素的显示设置为无的类,而是使用 display: block;在 .hidden 类的 CSS 中。然后使用 $('.hidden').hide() 和 $('.hidden').show() 来隐藏和显示整个东西。

    像这样:

    $(document).ready(function(){
        $('.hidden').hide();
        $('.someButtonThatShowsStuff').click(function(){
            $('.hidden').show();
            $("#test").selectmenu();
            $("#radioset").buttonset();
        });
    });
    

    编辑:修改代码以在显示元素后应用可视插件。

    【讨论】:

    • 当我调用show时选择对象没有正确显示的相同效果。
    • 您可能想在元素显示后尝试应用插件。我已经修改了答案。
    • 呃。我希望我不必那样做。我有很多我经常隐藏和显示的 div。在显示/隐藏 div 后必须动态应用插件非常烦人。我会尽力让你知道...
    猜你喜欢
    • 1970-01-01
    • 2020-03-12
    • 2023-03-03
    • 2013-08-05
    • 1970-01-01
    • 2015-12-26
    • 1970-01-01
    • 1970-01-01
    • 2018-02-13
    相关资源
    最近更新 更多