javascript - Jquery UI Dialog 中的复选框在 Firefox 22.0 和 Opera 中不出现，但在 Firefox 20.0 中出现

Question

我在使用一些 HTML 复选框时遇到了问题

问题是:我在对话框中弹出的表单中的复选框不会出现在某些版本的 Firefox 和 Opera 中。我实际上使用的是 Fedora 和 Firefox 20.0在 Safari 上，三个复选框不会出现。仅显示标签。在 Firefox 22.0 上的另一台计算机上也是如此

有人知道解决方案吗？或者我能找到关于这个问题的一些信息吗？我搜索了很多，但没有找到任何解决方案。

这是我的 HTML 代码:

<div id="addFormular" title="Create a conference" class="hidden">
    <form id="postform" action="." method="post">
    <div id="checkOption">
        <div class="optionDiv">
            <input class="addBox" type="checkbox" id="checkHD" /><label class="addOption" for="checkHD"><?php echo Lang::getFromKey("HD"); ?></label>
        </div>

        <div class="optionDiv">
            <input class="addBox" type="checkbox" id="checkRecord" /><label class="addOption" for="checkRecord"><?php echo Lang::getFromKey("Record"); ?></label>
        </div>

        <div class="optionDiv">
            <input class="addBox" type="checkbox" id="checkTeacup" /><label class="addOption" for="checkTeacup"><?php echo Lang::getFromKey("Add a tea cup"); ?></label>
        </div>
    </div>
    </form>
</div>

这是我的 Javascript:

var popUpConf = $('#addFormular').dialog({
            resizable: false,
            draggable: false,
            position: {my: "left top", at: "right bottom", of: "window"},
            dialogClass: 'no-close',
            modal: true,
            width: 'auto',
            closeOnEscape: false,
            open: function(event, ui) { $(".ui-dialog-titlebar-close", ui.dialog || ui).hide(); },
            buttons: [

            {   
                text: "Annuler",
                click: function() {

                    $(this).dialog("close");
                }
            },

            {
                text: "Valider",
                click: function() {
                    $(this).dialog("close");
                }
            }]
        });

    }

以及所需的 CSS:

.postForm {
width: 100%;
display: block;
} 

.addOption{
vertical-align: top;
}

.addBox{
margin-top: 1.5px;
}

.optionDiv{
margin-top: 5px
}

谢谢!

编辑:

http://jsfiddle.net/U3pCw/这个仅使用我的 HTML 的演示在我的 Firefox 20.0 上显示复选框，但在 Opera 和 Firefox 22.0 上不显示复选框...我真的无法理解。

Answer 1

我刚刚用最新的 Chrome 测试了你的 fiddle - 同样的事情发生了，不过，我注意到了消失的滞后。

检查类 - “addBox” - 似乎被 AdBlock 插件阻止。我的 Chrome 的 AddBlockPlus 也捕获并隐藏了它。

将类更改为其他内容即可解决问题，您也应该这样做。