CODEWITHSUNDEEP
javascriptjquery
Canvas
Canvas

Reputation: 5897

Jquery function is being called on load

I have some jquery which I want to run on load time but It doesn't seem to hit the load event. Here is my jquery

$(function () {
    $('.field-of-work').load(function () {
        var $wrapper = $(this).closest('.field-of-work-wrapper');

        $wrapper.find('.position').hide();
        $wrapper.find('.position').find('select').val('');

    });
});

Why would the load event not get hit?

Upvotes: 0

Views: 122

Answers (4)

Kaz
Kaz

Reputation: 748

$(function() is an alias for $(document).ready(function(){}) and your load event is fired before the document ready event.

If you want your code inside the load listener to fire on page loading, you should put it outside of any $(function() or $(document).ready() like this : 

$('.field-of-work').on('load', function () {
    var $wrapper = $(this).closest('.field-of-work-wrapper');

    $wrapper.find('.position').hide();
    $wrapper.find('.position').find('select').val('');

});

$(function(){
   /* Your other code here */
});

Upvotes: 0

Rolf Beh
Rolf Beh

Reputation: 347

Do you use the Load function correctly?

Load requires an "url" as a parameter and returns the HTML into the matched element.

http://api.jquery.com/load/

Description: Load data from the server and place the returned HTML into the matched element.

load( url [, data ] [, complete ] )Returns: jQuery

Do you want to perform the actions inside your load method right after the page has been loaded?

You may want to use "ready()" instead of it:

$(document).ready(function() {

       var $wrapper = $(this).closest('.field-of-work-wrapper');

        $wrapper.find('.position').hide();
        $wrapper.find('.position').find('select').val('');
});

Or did you just want to add an Event Handler load to it (like 

.on( "load", handler ).

http://api.jquery.com/load-event/

Upvotes: 0

Youness
Youness

Reputation: 1495

try this :

 $(document).ready(function() {
    $('.field-of-work').load(function () {
        var $wrapper = $(this).closest('.field-of-work-wrapper');

        $wrapper.find('.position').hide();
        $wrapper.find('.position').find('select').val('');

    });
});

Upvotes: 0

Kyle Emmanuel
Kyle Emmanuel

Reputation: 2221

Try to use ready() method:

$(document).ready(function(){
    $('.field-of-work select').load(function () {
        var $wrapper = $(this).closest('.field-of-work-wrapper');

        $wrapper.find('.position').hide();
        $wrapper.find('.position').find('select').val('');

    });
});

Upvotes: 1

Related Questions