How to prevent IE from loading hidden content usin

2019-06-06 01:25发布

问题:

When you set an html element to have display: none, the content inside that element (e.g. images and flash) wont be loaded by Firefox until the element is set to be displayed. But Internet Explorer dont behave like that. It loads everything inside hidden elements from start.

Is there a way to prevent IE from loading such content without using javascript?

回答1:

Don't insert any content into that element? Only load it using ajax when the user makes is visible.



回答2:

As my question regarded a solution not using javascript, I'll answer my own question and just say there is no way so far to prevent IE from loading external files that are part of hidden content.

As the other answers suggest it, there are ways to avoid the problem, but not to solve it. So the answer to my specific question is "NO".



回答3:

Actually if you set the visibility to hidden, ie won't load it.



回答4:

Here is an example of what ZippyV is talking about (with a twist)... copy and paste the code below into a new file with an HTML extension and run it!

<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
</head>
<body>
<h1>This is the title</h1>
<p>This is a paragraph</p>
<div id="hidden-content"></div>
<p>Another paragraph</p>
<input type="button" id="add-content" value="Add Hidden Content" />

<script type="text/javascript">
    $(document).ready(function() {
        $("#add-content").click(
            function() {
                var info = unescape('%53%68%68%68%2E%2E%2E%20%73%65%63%72%65%74%20%69%6E%66%6F%72%6D%61%74%69%6F%6E');
                $("#hidden-content").html(info);
            }
        );
    });
</script>

</body>
</html>

The twist is that the hidden content to be displayed is first escaped (using the Javascript escape() function). Also, you can place the javascript in a separate file!



回答5:

display: none should be hiding the element contents from ie as well as any other browsers.

Did you close all the tags?



回答6:

function hide_show_content(el_ID){

        //try <element hidden> property NOT IExplorer
        try{el_ID.hidden = ((el_ID.hidden) ? false : true);}catch(_e){}
        //try style=display:none for IExplorer
        try{
            if(el_ID.style.display==""){return;}
            el_ID.style.display = ((el_ID.style.display=="none") ? "inherit" : "none");
        }catch(_e){}

    }



<span id="text#1"  style="display:none;" hidden>TEXT TO BE HIDDEN or SHOWN laiter.</span>

<a href="" onClick="hide_show_content(document.getElementById('text#1')); return false;">Click to show TEXT</a>