|
JavaScript - Body Onload Setinterval
I found a little chat script online and I wanted to check it out. When I integrated it into a page I created, for some reason this will not work correctly
<body onload="setInterval('chat.update()', 1000)"> I tested it with two different browswers open Lets say on two different browser windows you have user1 and user2 if user1 types 'Hello' it will not show up on user2 window but if user2 types 'Hi' then on user2 window it will say user1 says Hello user2 says Hi so basically for user1 to see what user2 has wrote, user1 has to type something first and send it to see what user2 said. hope you understand, if you would like I could post up the code. Similar TutorialsHello Can anyone help with the following problem On the following page http://www.stroudskittles.co.uk/signingon.html I have a Body onload event (to load the chained Menu) and a windows.onload event (to load the IFrame Ticker) If I open the page in Internet explorer both scripts function; however in Firefox I'm having problems. The Chained Menu works, however the IFrame Ticker does not display. Both events ahave ben placed on the boady tag. Can anyone advise how I can get both to display in Firefox Can anyone hi guys, how can i get this code to load on body onload? without fading in and out? Code: <html>
<head>
<!-- For ease i'm just using a JQuery version hosted by JQuery- you can download any version and link to it locally -->
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function() {
$("#responsecontainer").load("response.php");
var refreshId = setInterval(function() {
$("#responsecontainer").load('response.php?randval='+ Math.random());
}, 9000);
$.ajaxSetup({ cache: false });
});
</script>
</head>
<body>
<div id="responsecontainer">
</div>
</body>
Thanks i cannot understand, am i making the same mistake each time but my <body onload="startChecking()"> does not want to load again?? here my full code: Code: <head>
<script language="JavaScript" type="text/javascript">
var sendReq;
var receiveReq;
var lastmessage = 0;
var mTimer;
function startChecking()
{
receiveReq = new XMLHttpRequest();
console.log("1234");
getNewMessage();
}
function getNewMessage()
{
if (receiveReq.readyState == 4 || receiveReq.readyState == 0)
{
console.log(receiveReq.readyState);
}
mTimer = setTimeout('getNewMessage();',30000);
}
</script>
</head>
<body onload="startChecking()">
//more code here
</body>
i just want the console.logs to execute then i will continue with the rest of my code... please help? thank you Hi, Is there any alternative to the ' body onload="" ' function? I have on the page several scripts running and one is blocking the others because of the body onload function. It is working if I change that to body onfocus but it is loading the content all over when the user gets back to the page. Any ideas how can I avoid this? I can't apply onload to some element, onfocus is not working and this code also does not suite me: Code: <script type="text/javascript> function(); </script> Thanks in any case! Batric I am a novice with Javascript and need help. The homepage of the website I am developing includes a simple javascript slideshow. The code for the script came from a different site that allowed code sharing. It functions wonderfully once loaded. However, in Internet Explorer, I must control-click to allow for the script to run. This wouldn't be a huge problem, but it is an inconvenience to visitors of the site. Since the website is for a public high school, the district computers have a high security setting. Therefore, anyone trying to access the site from a school computer (the main clientele) will have to control-click and allow access everytime they wish to visit the site. Not ideal. I know my problem is that I am using <body onload="runSlideShow">. I have tried including the defer attribute, but that did not work. Is there any other way I can write the code to not cause viewers to control-click everytime the page is loaded? Thanks tons! EDIT---- When opened in IE 7, there is a bar that warns againsts scripts and activex. I understand that I can lower my personal security setting, but I don't have the authority to do so for district PCs. Once a user clicks to allow the script the slideshow begins automatically. So, how can I write the code so that the warning bar does not show up? ---- Here's the bit of code that is applicable. Code:
<script language="JavaScript">
var slideShowSpeed = 4000;
var crossFadeDuration = 4;
var Pic = new Array();
Pic[0] = 'field.jpg'
Pic[1] = 'mural3.jpg'
Pic[2] = 'cheer1.jpg'
Pic[3] = 'Nuncrackers.jpg'
Pic[4] = 'soccer4.jpg'
Pic[5] = 'radio4.jpg'
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad[i] = new Image();
preLoad[i].src = Pic[i];
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuration)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
}
</script>
<body onload="runSlideShow()">
<img src="field.jpg" name='SlideShow' width="814" height="300" />
What I mean is that my <body> tag currently is like this: Code: <body class="page-course"> I would like to insert a pop-up contact form which requires the body tag to be like this: Code: <body onload="javascript:fg_hideform('fg_formContainer','fg_backgroundpopup');">
Not quite sure how to merge these - indeed can I merge them? Perhaps better to make the body class (top example) execute elsewhere? THANKS!! Hey guys I am having trouble loading a drop down menu list script that I got from Dynamic Drive. Here's the original test page. (Works Fine) <html> <head> <script language="javascript" src="http://www.modbargains.com/images/Javascript/ChainSel/chainedmenu.js"> </script> <script language="javascript" src="http://www.modbargains.com/images/Javascript/ChainSel/MBVehicleChainSelect.js"></script> </head> <body onLoad="initListGroup('Vehicles', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, 'savestate')"> <form name="listmenu0"> <table align="center"> <tr> <td><select name="firstlevel" style="width:160px;"></select></td> </tr> <tr> <td><select name="secondlevel" style="width:160px;"></select></td> </tr> <tr> <td><select name="thirdlevel" style="width:160px;"></select></td> </tr> <tr> <td><input type="button" value="Go" onClick="goListGroup(document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel)"> <input type="button" value="Reset" onClick="resetListGroup('Vehicles')"> </tr> </table> </form> </body> </html> HOWEVER! The site I am working on (which is on a different server) does not allow me to alternate the body tag. Is there an alternative way of doing a body onLoad without actually alternating the body tag? I read that you could do a function onload using javascript, so I tried using this: <script language="javascript" > window.onload = initListGroup('Vehicles', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, 'savestate'); </script> I am not sure if the function is correct but it does not work. Any ideas how I can make this work???? Hi guys. I have a quick question. What's the code for having a link with the id "autoid" clicked when the body of my html code loads? Thanks, Alex hi all im trying to hide a div on page load, ive used this. Code: <script type="text/javascript">
function hideDiv(){
document.getElementById('sidebar').style.display = "none";
}
hideDiv()
</script>
and this in the body tag Code: <body onload="javascript:hideDiv()"> it works fine hiding the div named sidebar, problem comes when i try to then use an Onclick event to show the hidden div, it just wont show. can this be done? please help if you can this work has to be in soon Hi, I have a form that I am submitting using JQuery, if I copy and paste the form into my main page, everything works fine. If I try to call the form in a separate page to onload none of the buttons work. Is there away around this? Not sure if providing my script helps or not, but just in case here it: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<title>Messages</title>
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function (){
$('#submitNewSend, #submitNewSend2, #submitNewSave, #submitNewSave2').click(function(){
var btn = $(this).attr('id');
if(btn == 'submitNewSend'){
file = 'insertMessage.php';
Msg = 'Your message has been sent';
} else if(btn == 'submitNewSend2'){
file = 'insertMessage.php';
Msg = 'Your message has been sent';
} else if (btn == 'submitNewSave'){
file = 'insertSaveMessage.php';
Msg = 'Your message has been saved';
} else if (btn == 'submitNewSave2'){
file = 'insertSaveMessage.php';
Msg = 'Your message has been saved';
}
var data = $('#MessageNew').serialize();
$.post (file,data, function(){
alert(Msg);
$('#MessageNew').each (function(){
this.reset();
});
});
return false;
});
});
</script>
<script type="text/javascript">
function loadXMLDoc(File,ID){
if (window.XMLHttpRequest) {
xmlhttp=new XMLHttpRequest();
}
else {
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function(){
if (xmlhttp.readyState==4 && xmlhttp.status==200){
document.getElementById(ID).innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("POST",File,true);
xmlhttp.send();
}
</script>
<head>
<body onload="loadXMLDoc('getloadCompose.php','txtHintCompose')">
<br />
<br />
<div id="txtHintCompose"></div>
</form>
</body>
</html>
And the getloadCompose.php is: Code:
<form action="" method="post" name="MessageNew" id="MessageNew" autocomplete="OFF">
<table id="new" width="60%">
<tr>
<th>Compose Message</th>
</tr>
<tr>
<td class="first">
<input type="button" class="button3" name="submitNewSend2" id="submitNewSend2" value="Send">
<input type="button" class="button3" name="submitNewSave2" id="submitNewSave2" value="Save">
<input type="button" class="button3" name="submitNewCancel" value="Cancel" onclick="loadXMLDocRefresh('getloadInbox.php','txtHintMessage')" />
</td>
</tr>
<tr>
<td>
<br />
<label class="two"><b>To:</b></label><input type="text" class="input" name="to" id="to" value=""><input type="text" class="input" name="recipient" id="recipient" value="" onkeyup="showHint(this.value, 'getEmailName.php','txtHintEmailTo')" size="70" /><br /><br />
<div id="txtHintEmailTo"></div>
</td>
</tr>
<tr>
<td>
<label class="two"><b>Subject:</b></label><input type="text" class="input" name="subject" id="subject" value="enter subject" onclick="this.value='';" onfocus="this.select()" onblur="this.value=!this.value?'enter subject':this.value;" size="70" /><br /><br />
</td>
</tr>
<tr>
<td>
<label class="two"><b>Message: </b></label><div class="scroll"><textarea rows="10" cols="75" class="input" name="messsage" id="message">Enter Message</textarea></div><br /><br /><br />
</td>
</tr>
<tr>
<td class="first">
<input type="button" class="button3" name="submitNewSend" id="submitNewSend" value="Send">
<input type="button" class="button3" name="submitNewSave" id="submitNewSave" value="Save">
<input type="button" class="button3" name="submitNewCancel" value="Cancel" onclick="loadXMLDocRefresh('getloadInbox.php','txtHintMessage')" />
</td>
</tr>
</table>
</form>
I know I have buttons doing the same function,there is an ease of use reason for it. I can put everything on my main page if necessary, but it wouldn't really be doing exactly what I want it to do. Hi, I am building a navbar using suckerfish. The company that I am using to host the site places onload="page_init()" in the <body> tag automatically. This kills the suckerfish js. Is there a way to remove this onload="page_init()" using a js, or will it just kill that js also? Hi Guys, I'm new to javascript and I'm trying to have a delay. I seem to be having trouble with the setInterval(). Will someone please be able to tell me what have I have done wrong? Code:
function viewData()
{
var num = 10;
setLoop(num);
}
function setLoop(i)
{
setInterval(loopOpacity(i), 300);
}
function loopOpacity(i)
{
i--;
var iNum = "0." + i;
document.getElementById("fade").style.opacity = iNum;
if(i == 4)
{
document.getElementById("viewData").className = "view";
clearInterval(int);
}
else
setLoop(i);
}
function closeData()
{
document.getElementById("fade").style.opacity = 1;;
document.getElementById("viewData").className = "close";
}
Thanks for your help, tecmeister. Hi, I've been working on a clock script that will appear on a frame of my site. Originally, I had used the following to refresh the page every second to the script shows the updated time and seconds. Code: <meta HTTP-EQUIV="Refresh" url="WEBSITE HERE" CONTENT="1"> This worked but unfortunately, there was the refresh "tick" sound every second, which became too annoying! I found the "setInterval" method and tried to apply it to my code. For the purpose of this thread, I've created another script similar to mine, but about 1/20 as long, though the result is the same. I would like it to re-run every second using setInterval, but it only runs once and then disappears. Code: <script type="text/javascript">
<!--
updateClock();
setInterval ("updateClock()", 1000);
function updateClock()
{
var t = new Date();
var seconds = t.getSeconds();
document.write(seconds);
}
// -->
</script>
Any help would be appreciated!! Thanks. How would you use setInterval so that theres a delay each time javascript runs through a certain loop?
Hello. I'm trying to get a script (and an html page, I guess) to run constantly, and I'm pretty sure I should be using setInterval() to do this. But I'm not familiar enough with Javascript to know what I'm doing wrong, or what I need to fix. This is the code... Code: <html>
<head>
<script type="text/javascript" src="wz_jsgraphics.js"></script>
<script type="text/javascript">
<!--
function initialize_field() {
var jg = new jsGraphics();
var pixel_spacer = 10;
var field_length = 1000;
var field_width = 600;
jg.drawRect(pixel_spacer,pixel_spacer,field_length,field_width);
//...
return jg
}
function main() {
our_field = initialize_field();
dateobj = new Date();
current_time = dateobj.getMilliseconds();
our_field.drawString("Hello world!",current_time,500);
our_field.paint();
}
-->
</script>
</head>
<body onload="main(); setInterval('main()', 250 )">
</body>
</html>
If I understand setInterval() correctly, this should cause the page to run the main() function every 250 seconds. And within main(), the "Hello world!" string is being drawn at some point between 0 and 1000 pixels, depending upon the number of milliseconds, so it should essentially be scrolling across the screen. But I can only get it to "scroll" if I hammer F5 to repeatedly load the page. How can I get the main() function to run repeatedly? I tried calling main() from main(), but that did not work well... Thanks for any suggestions you have! Hello, I'm having trouble with some scripts conflicting and interrupting my animation. I have a small website build around Joomla and I do my own modules and components.. I've made a simple browser game that uses Javascript's setInterval to highlight some elements. A few days ago I decided to add some advertising banners to cover the server costs but those banners are using Javascript and are interrupting my "game"... Is there a way to stop that from happening ? The script flow goes like this... Step 1. An XMLHttpRequest is being made and the server returns X numbers of elements out of Y total elements that need to get highlighted. Step 2. The elements default state is "blank" then a loop goes through the Y elements and sets a className of "highlight" on the elements that need to get highlighted. Step 3. The setInterval is being called and executes the code that highlights the X elements on every interval. Code: mytimer = setInterval ( animation, 500 ); The animation variable holds a function that changes the elements with class "highlight" to "highlighted". Some pseudo-code: Code: // After all the AJAX requests and more doodle codes...
while(i < num_arr.length) { // num_arr holds the X numbers to get marked as highlight
document.getElementsByTagName('td').item(X).setAttribute('name', 'highlight');
i++;
}
mytimer = setInterval ( animation, 500 );
var animation = function() {
document.getElementsByTagName('td').item(X).className = 'highlighted';
// There is an "if" check to kill the setInterval if no more Xs are found
clearInterval(mytimer);
}
* The above code is just a short example of the actual script * Any help would be much appreciated.. Thank you. i have found a very simple ajaxexample on the internet, when this works i can adept it to my site, but it doesn't work :-( anybody sees why? Code: <div align="center" id="timeval">--:--:--</div>
<button id="stop">Stop</button>
<script src="jquery.js"></script>
<script>
$(document).ready(function()
{
//ajaxTime.php is called every second to get time from server
var refreshId = setInterval(function()
{
$('#timeval').load('ajaxTime.php?randval='+ Math.random());
}, 1000);
//stop the clock when this button is clicked
$("#stop").click(function()
{
clearInterval(refreshId);
});
});
</script>
and the phpscript:
ajaxtime.php
<?php
echo date("g:i:s A");
?>
I have this: function doThese(id){ clearInterval(interval); doThis(id); var interval = function(){ setInterval("doThis('"+id+"')", 2000); } interval(); doThisToo(id); alsoDoThis(id); } Everything works fine together. However when I run the doThese() function a second time(with different id), the interval keeps using the id of the first run. Thought clearinterval would fix that.. it doesn't. Any suggestions? Thx in advance. Can anyone tell me how the following code actually works please? I've been trying to work out exactly why I need it all, but can't understand it at all! Code: var speed = 50
var myInterval
var pause
function start(){
window.clearInterval(pause)
myInterval = setInterval("auto()",speed)
}
pause = setInterval("start()",3000)
The body onLoad is set to run start(). If anyone can explain why this code is needed I would be very greatful. Hey guys, Im playing around with JS trying to learn more and i have come across this bit of code Code: <script type="text/javascript">
function print () {
document.write("Words ");
}
setInterval("print()", 1000);
</script>
Just having problems getting it to display correctly in all browsers its displaying the first Words fine in all but will only continue to reprint "Words" in chrome. Thanks any help tips ideas would be great. |
|||||||