Firefox не отображает элемент <input>внутри модального диалога JQuery

Question

Я пытался найти какие-либо подсказки, но не обнаружил ни одной.Посмотрите на следующую страницу:

http://jqtest.encorephoenix.com/withinput.aspx (модальное всплывающее окно JQuery с <input>)

Всплывающее окно корректно отображается в IE, Chrome, Safari и Opera.Firefox 3.6.13 неправильно отображает всплывающее окно.Вы можете просмотреть безinput.aspx по тому же URL-адресу, чтобы увидеть, что Firefox отображает его правильно, поскольку на этой странице нет элемента <input>.Я пробовал следующее без разрешения этой специфической проблемы:

• Измененный тип документа
• Используется для включения <input>
• Используется для включения <input>
• Использованы все возможные атрибуты отображения CSS для <input>

Будем благодарны за любые предложения.

Answer 1

Исправление было предложено mayur.unagar при http://forums.asp.net/t/1643984.aspx и оно работает во всех браузерах, включая Firefox, конечно.:)

Если вы не хотите заходить по ссылке, исправление заключается в удалении {overflow: hidden;} в классе .ui-dialog из пользовательского CSS для 1.8.8 JQuery UI.Я протестировал его во всех текущих выпущенных версиях основных браузеров.

Answer 2

Возможно, проблема связана с функцией, которая запускается при вызове события ready.

Если я вставлю эту функцию в консоль Firebug и запусту ее, появится модальное окно:

$(function () {
    var dlg = jQuery("#divPopup").dialog({
        modal: true,
        draggable: true,
        resizable: false,
        show: 'Transfer',
        hide: 'Transfer',
        height: 400,
        width: 480,
        minHeight: 400,
        minWidth: 480,
        autoOpen: false
    });
    dlg.parent().appendTo(jQuery("#form1:first"));
});

Это говорит о том, что, когда это вызывается в первый раз, оно не связано должным образом с элементами DOM.Ошибка проверки HTML может быть связана или с типом документа.

Я вижу предупреждения в своем инструменте проверки HTML, в результате чего система считает, что это другой тип документа.Кроме того, любое использование элементов нестандартным способом может способствовать такому поведению.

• Решением этой проблемы является постепенное сокращение элементов на странице, пока проблема не исчезнет, ​​а затем медленно добавитьэлементы, пока вы не найдете тот, который отбрасывает анализатор.
• Либо исправьте тип документа так, чтобы он соответствовал стандартному используемому кодированию HTML.

Answer 3

Div расположен в верхней части страницы.На данный момент я смог получить отображение, добавив к верху поля 100px поле класса

.ui-dialog .ui-dialog-titlebar
{
margin-top:100px;
}

. Я исследую его подробнее.Но другие могут примерить это. Всплывающее окно также не работает должным образом на IE9.