JQuery dialog not working on IE 9.0, but good in Chrome, need to run in IE

问题

I have two classic asp files, default.asp which creates a dialog and opens with load default2.asp default2.asp shows some controls and a link which calls a javascript function which does some activity and close the dialog

This thing is working fine in Chrome but not in IE 9.0, can any one have idea why? will be highly appreciated.

Thanks

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
    <title>Default.asp</title>
  <link rel="stylesheet" href="/jquery/themes/base/jquery-ui.css" />
  <script src="/JQuery/jquery-1.9.1.js"></script>
  <script src="/JQuery/jquery-ui.js"></script>

  <style>
    body { font-size: 85.5%; }
    div#mydiv { width: 350px; margin: 20px 0; }
  </style>

<script>
$(document).ready(function(){
    var MyDlg = $( "#mydiv" );
    MyDlg.dialog({
                autoOpen: false,
                 closeOnEscape: true,
                 modal: true,
                 width: 300,
                 height: 400,
                 modal: true,
                 resizable: true,
      buttons: {
        Cancel: function() {
          MyDlg.dialog( "close" );
          }
               }
    });



$("#Opendlg").click(function() {
  MyDlg.load("Default2.asp").dialog("open");
});

});
</script>

</head>
<body>
This is a test form-1
<br><br>

<% 
Dim FName, LName
FName = Request.form("fname")
LName = Request.form("lname")

Response.write("The First name was := " & FName & " and Last name was:=" & LName )
%>

<br><br>
<form ID=Form1 method="post" action="Default.asp">
First Name: <input type="text" name="fname"><br>
Last Name: <input type="text" name="lname"><br><br>
<input type="submit" value="Submit">
</form>
<br><br>

<input type="button"  class="ui-widget" ID="Opendlg" value="Open Dialog"/>

<div id="mydiv"  title="Product Wizard">
</div>

</body>
</html>

------------------------------------- Default2.asp----------------------------------------

<script type="text/javascript">
$(function() {
    $('#Form2').submit(function(evt) {
        evt.preventDefault();
        $.ajax({
            url: "Default2.asp", 
            type: 'POST',
            data: $(this).serialize(),
            success: function(result) {
                $('#mydiv').html(result);
            }
        });
    });
});

var MyDlg = $( "#mydiv" );

$(".ui-widget-overlay").click (function () {
    MyDlg.dialog( "close" );
});

function CloseMe()
{
 $("#mydiv").dialog("close");
}

</script>

This is Default2.asp file
<br><br>

<% 
Dim Name, Address
Name = Request.form("Name")
Address = Request.form("address")

Response.write("The Name was " & Name & " and Address was " & Address )
%>
<a href="Javascript:CloseMe();">Close Me</a>

<br><br>
<form ID=Form2 >
Name: <input type="text" name="Name"><br>
Address: <input type="text" name="address"><br><br>
<input type="submit" value="Submit">
</form>

回答1:

$(this).closest('.ui-dialog-content').dialog('close');

Try is..It will close the dialog.

回答2:

I found that I was using Google apis which works fine on Chrome but not in IE so I replaces those references with JQuery files downloaded from JQuery.com and I tested them on IE and everything works fine for this problem mentioned in Question.

Thanks all for answering and tried to help me with their best :)

Instead of using these on IE

http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js

Used these after downloading and saved in local folders.

来源：https://stackoverflow.com/questions/15491173/jquery-dialog-not-working-on-ie-9-0-but-good-in-chrome-need-to-run-in-ie

标签

jquery-ui

jquery-ui-dialog