jQuery - function runs fine when fired on div click, but not on page load

Question

I have the following function that I want to run on page load and re-run when you click div#trigger. When you click div#trigger everything is fine. However on page load the code appears to sometimes work but sometimes indent the the wrong amount, and the alert (which i just put in there for debugging purposes) never fires. Thanks

  function textIndentFunc () {

     textString = $('#from-1 :selected').text();

     $('#hidden').text(textString);

     textWidth = $('#hidden').width();

     inputWidth = $('#from-1 select').width();

     indentMy = (inputWidth / 2) - (textWidth / 2);

    $('#from-1').css('text-indent',indentMy);

}

 $('#trigger').click(function(){
    textIndentFunc();
    alert('fire');
 });

textIndentFunc();

UPDATE - I should have mentioned this code runs on document.ready.

UPDATE - moving the code to window.load doesn't change anything.

Can you post what you have on a jsFiddle?

kei
– kei

2012-05-14 16:10:40 +00:00
Commented May 14, 2012 at 16:10 — kei
– kei, Commented May 14, 2012 at 16:10

Reinstate Monica Cellio · Accepted Answer · 2012-05-14 15:46:05Z

2

Wrap the function call in a document.ready handler like this...

$(function() {
    textIndentFunc();
});

That makes sure that the DOM is loaded before trying to do anything to manipulate it, otherwise you'll get different results at different times, depending on what's loaded and what's not.

answered May 14, 2012 at 15:46

Reinstate Monica Cellio

26.2k6 gold badges54 silver badges67 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Evanss Over a year ago

It was already in a function but ive now moved it to window.load but the problem persists. Thanks

Reinstate Monica Cellio Over a year ago

Seeing the rest of your code would help then because what you've shown us should work fine.

Josh Mein · Accepted Answer · 2012-05-14 15:46:22Z

2

Your function need to be called in document.ready call

$(document).ready(function() {
   textIndentFunc();
});

answered May 14, 2012 at 15:46

Josh Mein

28.6k15 gold badges79 silver badges89 bronze badges

Comments

Vijaya Raaja Velu · Accepted Answer · 2016-06-30 10:06:30Z

1

Try as below

  $(document).ready(function () {
$('#trigger').click(function(){
    textIndentFunc();
    alert('fire');
 });
});

function textIndentFunc () {

     textString = $('#from-1 :selected').text();

     $('#hidden').text(textString);

     textWidth = $('#hidden').width();

     inputWidth = $('#from-1 select').width();

     indentMy = (inputWidth / 2) - (textWidth / 2);

    $('#from-1').css('text-indent',indentMy);

}
textIndentFunc();

<div id="trigger">Hai</div>

answered Jun 30, 2016 at 10:06

Vijaya Raaja Velu

438 bronze badges

Comments

Giorgos Manoltzas · Accepted Answer · 2012-05-14 15:47:20Z

0

Do you have another function that also runs on page load? Because if this is the case maybe the 2 functions have a conflict...

answered May 14, 2012 at 15:47

Giorgos Manoltzas

1,7015 gold badges24 silver badges34 bronze badges

2 Comments

Evanss Over a year ago

Only other function hides the browser chrome: function hideChrome() { setTimeout(function() { window.scrollTo(0, 1) }, 100); }

Evanss Over a year ago

Im not sure if moving the code to window.load helped but for some reason when I also changed the order of my other function it fixed this. Thanks

kei · Accepted Answer · 2012-05-14 15:49:44Z

0

If you already are calling textIndendFunc in $(document).ready and is still not getting what you're expecting, try moving textIndentFunc to $(window).load.

answered May 14, 2012 at 15:49

kei

20.5k2 gold badges38 silver badges64 bronze badges

Collectives™ on Stack Overflow

jQuery - function runs fine when fired on div click, but not on page load

5 Answers 5

2 Comments

Comments

Comments

2 Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

2 Comments

Comments

Comments

2 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related