$(document.body).append() doesn't seem to work in IE

问题

I am redirecting my user to my default.aspx when his session expires and default page is referenced under a master page. I show a notification like twitter stating Session Expired what happens is it works fine in firefox and google chrome but not in IE. I get Internet Explorer cannot open site-http://localhost:1335/order/Default.aspx?Sid=1 Operation aborted

I googled this and found that $(document.body).append() before the body tag was the problem if i move the script to my bottom of my page my notification doesn't work in any browser.

Here is my master page,

<head runat="server">
    <title></title>

    <script src="Javascript/Jquery1.4.js" type="text/javascript"></script>

    <script type="text/javascript">
        function topBar(message) {
            $("#alertmsg").remove();
            var $alertdiv = $('<div id = "alertmsg"/>');
            $alertdiv.text(message);
            $alertdiv.bind('click', function() {
                $(this).slideUp(200);
            });
            $(document.body).append($alertdiv);
            $("#alertmsg").slideDown("slow");
            setTimeout(function() { $alertdiv.slideUp(200); }, 5000);
        }
    </script>

    <asp:ContentPlaceHolder ID="head" runat="server">
    </asp:ContentPlaceHolder>
</head>
<body>

and my topbar function is called in my default.aspx page,

protected void Page_Load(object sender, EventArgs e)
{
    Int64 id = GetId(Request.RawUrl.ToString());
  if (id == 1)
  {
    ScriptManager.RegisterClientScriptBlock(Page, this.GetType(), "json", "topBar('Session Expired');", true);
  }
}

回答1:

I could not find the place where topBar is called, but if I call it from $(document).ready() it worked like a charm in my IE8:

<script type="text/javascript"> 
    function topBar(message) { 
        $("#alertmsg").remove(); 
        var $alertdiv = $('<div id = "alertmsg"/>'); 
        $alertdiv.text(message); 
        $alertdiv.bind('click', function() { 
            $(this).slideUp(200); 
        }); 
        $(document.body).append($alertdiv); 
        $("#alertmsg").slideDown("slow"); 
        setTimeout(function() { $alertdiv.slideUp(200); }, 5000);
    }

    $(document).ready(function() {
        topBar("Hello world!");
    });
</script>

You could also use $(window).load() if you have graphics and/or other heavy elements that needs to be loaded before topBar() is called:

$(window).load(function() {
    topBar("Hello world!");
});

Hope it helps.

EDIT:

Maybe this can be of some help? Basically you could do something like this:

ScriptManager.RegisterClientScriptBlock(this, typeof(Page), "json",  
    @"$(document).ready(function(){   
             topBar("Hello world!");
             }); 
        });", true);

Check out the answer in the link because he gives a couple of alternatives

来源：https://stackoverflow.com/questions/3518890/document-body-append-doesnt-seem-to-work-in-ie

标签

jquery

internet-explorer

append

document-body