Can't apply simple hide function on div

问题

EDIT: This is for leaning purpose

I have jQuery library included in my header:

<script src="assets/js/jquery-1.11.0.min.js"></script>

In body I have simple div:

<div id="image">
    <img class="width" src="assets/images/janka.jpg">
</div>

And at the end of body is simple script:

<script>
    $("#image").load(function () { 
        $("#image").hide();         
    });
</script>

I would like to hide "image" div after loaded by jQuery function hide(). But nothing happens after page is loaded, div is still visible. In browser console is no error shown. Can't find out what I'm doing wrong. Pls, correct my banal error there.

回答1:

load can be called on Body,iframe,img etc. but not on divs, Instead if you wish to use onload event on an element, you need to bind it with the element for eg. with div.But basically there are 2 ways to call a function 1. is to call function just after div load , write just after div element

       <div id="image">
            <img class="width" src="assets/images/janka.jpg">
    </div>

<script>
   function toHide() { 
        $("#image").hide();         
    }
    toHide();
    </script>

2. is to fire function onload of img instead of div

    $("#image img").load(function () { 
                $("#image img").hide();     //USING JS function    
            });
        OR



         $("#image").load(function () { 
                $("#image").css('display', 'none');     //USING CSS   
            });

回答2:

The #image element is a div which does not raise the load event. You need to select the img element inside that which does raise the event:

$("#image img").load(function () { 
    $("#image").hide();         
});

回答3:

It should be img:

$("#image img").load(function () { 
        $("#image img").hide();         
    });

The load of the div can't be checked but images can be. If you want to hide div right after html is ready then use ready handler:

$(document).ready(function(){
 $('#image').hide();
});

But you're using the script at the end of closing body you just apply this:

$('#image').hide();

来源：https://stackoverflow.com/questions/27618267/cant-apply-simple-hide-function-on-div

标签

javascript

jquery

function

show-hide