irkevin Posted January 29, 2009 Share Posted January 29, 2009 Hi, what i have is a block of javascript code to refresh contents in an Iframe. So far it works, Now, on the page containing the iframe, i have a form, what i want is, when i move my mouse over the form, the refresh function should stop. here is the html <iframe name="shout" id="shout" src="chat.php" style="overflow:auto;overflow-x: hidden;" frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" height="150" width="100%"></iframe><br /><br /> <form method="post" name="posting" id="posting"> <table width="100%" border="0" cellspacing="0" cellpadding="5"> <tr> <td colspan="6">Your Message:</td> </tr> <tr> <td colspan="6"><input type="text" name="post" id="post" style="width:300px;" /> <input type="submit" value="Submit Shout" name="submit" /></td> </tr> </table> The JS code: <script type="text/javascript"> var milliSecondsToWait = 1000; function reloadIFrame(){ document.frames['shout'].location.href = "chat.php?" + (new Date().getTime()); myVar = setTimeout("reloadIFrame()",milliSecondsToWait); } var myVar = setTimeout("reloadIFrame()",milliSecondsToWait); </script> Thats it, how do i clear the timeout when i move my mouse over the <input type="text" .. Help plz Quote Link to comment Share on other sites More sharing options...
rhodesa Posted January 29, 2009 Share Posted January 29, 2009 <input type="text" name="post" id="post" style="width:300px;" onmouseover="clearTimeout(myVar);" /> Quote Link to comment Share on other sites More sharing options...
irkevin Posted January 29, 2009 Author Share Posted January 29, 2009 i already tried this but it didn't work Quote Link to comment Share on other sites More sharing options...
irkevin Posted January 29, 2009 Author Share Posted January 29, 2009 or another thing which might be best is that when people start typing in the textbox, the refresh stops.. but with my small knowledge in JS, i dont know how to achieve that Quote Link to comment Share on other sites More sharing options...
rhodesa Posted January 29, 2009 Share Posted January 29, 2009 hum...weird...works in a function though: <input type="text" name="post" id="post" style="width:300px;" onmouseover="stopReload()" /> <script type="text/javascript"> var milliSecondsToWait = 1000; function reloadIFrame(){ document.frames['shout'].location.href = "chat.php?" + (new Date().getTime()); myVar = setTimeout("reloadIFrame()",milliSecondsToWait); } function stopReload ( ) { clearTimeout(myVar); } var myVar = setTimeout("reloadIFrame()",milliSecondsToWait); </script> Quote Link to comment Share on other sites More sharing options...
irkevin Posted January 29, 2009 Author Share Posted January 29, 2009 did this work for you? Because here when i use this code, when i move my mouseover the textbox, the page still refresh, even when i type in .. i wonder why it wont accept to function stopReload :S i made a test like this: function stopReload ( ) { alert("I work"); } when i put my mouse over the textbox, i get a message with 'i work'.. Which mean the function works but it looks like the clearTimeout isn't working.. Any ideas? Quote Link to comment Share on other sites More sharing options...
rhodesa Posted January 29, 2009 Share Posted January 29, 2009 is there something in chat.php that is causing it to refresh itself? Quote Link to comment Share on other sites More sharing options...
irkevin Posted January 29, 2009 Author Share Posted January 29, 2009 No there's nothing that cause it to refresh itself. There's only this JS code.. Quote Link to comment Share on other sites More sharing options...
rhodesa Posted January 29, 2009 Share Posted January 29, 2009 this worked for me: <iframe name="shout" id="shout" src="chat.php" style="overflow:auto;overflow-x: hidden;" frameborder="0" scrolling="yes" marginheight="0" marginwidth="0" height="150" width="100%"></iframe><br /><br /> <form method="post" name="posting" id="posting"> <table width="100%" border="0" cellspacing="0" cellpadding="5"> <tr> <td colspan="6">Your Message:</td> </tr> <tr> <td colspan="6"><input type="text" name="post" id="post" style="width:300px;" onmouseover="stopReload()" /> <input type="submit" value="Submit Shout" name="submit" /></td> </tr> </table> <script type="text/javascript"> var milliSecondsToWait = 1000; function reloadIFrame(){ document.getElementById('shout').src = "chat.php?" + (new Date().getTime()); myVar = setTimeout("reloadIFrame()",milliSecondsToWait); } function stopReload ( ) { clearTimeout(myVar); } var myVar = setTimeout("reloadIFrame()",milliSecondsToWait); </script> Quote Link to comment Share on other sites More sharing options...
irkevin Posted January 29, 2009 Author Share Posted January 29, 2009 Yeps it does work I added onmouseout="reloadIFrame();" to start the refresh process again.. hope it wont do any harm. Thanks for your help Quote Link to comment Share on other sites More sharing options...
irkevin Posted January 29, 2009 Author Share Posted January 29, 2009 is it possible,say, when i type in the textbox, to stop the refresh also? Quote Link to comment Share on other sites More sharing options...
rhodesa Posted January 29, 2009 Share Posted January 29, 2009 instead of onmouseover....just use onfocus...that way if the cursor goes in the textbox it stops...then use onblur instead of onmouseout Quote Link to comment Share on other sites More sharing options...
irkevin Posted January 29, 2009 Author Share Posted January 29, 2009 wow sweet. I was about to use onkeypress to achieve this. lol Anyway, thanks again! have a nice day Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.