Ik krijg beide button maar niet werkende..
Wat doe ik verkeerd!?

myScript.js

var timeout;
$(document).ready( function(){
$(' #auto').load('load.php');
refresh();
startReload();
});
 
function refresh()
{
	setTimeout( function() {
	  $(' #auto').load('load.php');
	  refresh();
	}, 5000);
}
function stopReload() {
  clearTimeout(timeout);
}
function startReload() {
  timeout = setTimeout(function() { refresh(); }, 5000);
}


test.php

<html>
<head>

<script src="http://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="myScript.js"></script>


</head>
<body>
<div> 
<div id="auto"></div>
<br></br>
<button onclick="stopReload();">Stop</button>
<button onclick="startReload();">Start</button>
</div>
</body>
</html>


Als dit script werkende is plaats ik het graag in de sectie PHP Scripts(Jquery refresh div sectie met start/stop buttons).
Welke foutmelding krijg je (in de console van je browser)?

Je moet van "timeout" een globale variabele maken. Dus ergens bovenaan in je code
var timeout = null;
. anders is alleen bekend binnen je functie.
ik krijg geen fout meldingen.
var timeout = null;

var timeout; 

heb ik al geprobeert maar dan werkt de buttons nog steeds niet, ook weer geen fout melding.
cleartimeout(timeout); 

cleartimeout(refresh);

ook niet, ook weer geen foutmelding.
Je zet de timeout verkeerd. Als je een timeout binnen een timeout doet zoals je nu in je code hebt staan wordt de binnenste timeout nooit gestopt.
Hier in dit script dat ik nu gebruik doe ik het zelfde met de timeout en de buttons werken prima. Maar dit refresh de hele pagina, En dat is nu overbodig. Wat doe ik verkeerd dan in het nieuwe script(Hij refresh prima maar de buttons doen niks..)?

var timeout;
		$(document).ready(function () {
		  startReload();
		});

		function stopReload() {
		  clearTimeout(timeout);
		}
		function startReload() {
		  timeout = setTimeout(function() { window.location.reload(); }, 5000);
		}

Zie je serieus niet dat je 2 timeouts set in je andere script? Kijk eens naar je refresh() functie.
ik zie het nu ja.
Ik heb het volgende gedaan maar dan doet de buttons het ook niet:

var timeout;
$(document).ready( function(){
$(' #auto').load('load.php');
refresh();
startReload();
});
 
function refresh()
{
	setTimeout( function() {
	  $(' #auto').load('load.php');
	  refresh();
	}, 5000);
}
function stopReload() {
  clearTimeout(timeout);
}
function startReload() {
  timeout = refresh();
}
Als je nou in de refresh functie zou zeggen return setTimeout.... (dus even het woorde return toevoegen aan het begin) zou dat werken ja. Nu lijkt het alsof je gewoon maar wat aan het proberen bent zonder een idee te hebben wat de reden zou zijn dat dat zou werken.
Ik heb de return ervoor gezet maar de buttons doen het nog niet. Mijn excusses dat ik nieuw ben in javascript en dat dit mijn eerst script is in js.
Zo dan:

var timeout;
$(document).ready( function(){
$(' #auto').load('load.php');
refresh();
startReload();
});
 
function refresh()
{
    timeout = setTimeout( function() {
      $(' #auto').load('load.php');
      refresh();
    }, 5000);
}
function stopReload() {
  clearTimeout(timeout);
}
function startReload() {
  refresh();
}
Ja, dat doet het.
en ik snap het ook wat je verandert hebt.

i.p.v. dat de timeout in de startReload functie wordt aangegeven, gebeurt dat nu bij de refresh functie.
want daarvoor wist de refresh fuctie niet eens af van een startReload fuctie en andersom ook als ik het goed hebt.

Reageren