Почему этот диалог jQueryUI не работает в IE9? - PullRequest
Новая
       0

Почему этот диалог jQueryUI не работает в IE9?

6 голосов
/ 03 февраля 2012

Следующий код создает ожидаемое модальное всплывающее диалоговое окно jQueryUI в Firefox, Chrome и Opera. Тем не менее, это не удается в Internet Explorer 9: 

<html><head>

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/base/jquery-ui.css" type="text/css" media="all" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>

<script type="text/javascript">
$(function() {
    $( "#AddUser" ).dialog({
        autoOpen: false, modal: true, height: 'auto', width: 400,
        buttons: {
            "Add": function() {
                alert("Add one!");
            }
        },
        close: function() {
            allFields.val( "" ).removeClass( "ui-state-error" );
        }
    });

    $( "#AddUserButton" ).button().click(function(event) {
        event.preventDefault();
        $( "#AddUser" ).dialog( "open" );
    });


});
</script>

</head><body>

<div id="AddUser" title="Add User">Popup content here</div>
<input type="submit" id="AddUserButton" />

</body></html>

В IE 9 div #AddUser не является диалоговым окном jQueryUI. Есть ли что-то, чего мне не хватает?

РЕДАКТИРОВАТЬ : код обновлен ближе к производственному коду.

Спасибо.

Ответы [ 4 ]

10 голосов
/ 03 февраля 2012

ваша проблема в конце "," IE не нравится 

 $( "#AddUser" ).dialog({
                   autoOpen: false, modal: true >>,<<
            });

это будет работать: 

 $( "#AddUser" ).dialog({
                   autoOpen: false, modal: true
            });
5 голосов
/ 03 февраля 2012

Попробуйте добавить DOCTYPE в html-файл. <!DOCTYPE HTML>

1 голос
/ 13 февраля 2012

Хорошо, это всего лишь предположение, но type = "submit" иногда странно, т. Е. ...

вы пробовали: <button id="AddUserButton">AddUser</button>

также я бы назвал "protectDefault""как последнее действие внутри слушателя действия.

0 голосов
/ 29 марта 2017

У меня была та же проблема с диалоговым окном, и добавление следующего в css файле сделало работу за меня. 

.ui-widget-overlay
{
        z-index: 0 !important;   
}
...