-Javascript- Evenement onload (motools)
Bonjour à tous
J'ai un soucis d'événements javascript, mon but étant d'utiliser le script suivant :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
| var url = 'http://demos.mootools.net/demos/Ajax_Timed/ajax_timed.php';
// refresh every 4 seconds
var timer = 4;
// periodical and dummy variables for later use
var periodical, dummy;
var start = $('start'), stop = $('stop'), log = $('log_res');
/* our ajax istance */
var ajax = new Ajax(url, {
update: log,
method: 'get',
onComplete: function() {
// when complete, we remove the spinner
log.removeClass('ajax-loading');
},
onCancel: function() {
// when we stop timed ajax while it's requesting
// we forse to cancel the request, so here we
// just remove the spinner
log.removeClass('ajax-loading');
}
});
/* our refresh function: it sets a dummy to prevent
caching of php and add the loader class */
var refresh = (function() {
// dummy to prevent caching of php
dummy = $time() + $random(0, 100);
// we add out fancy spinner
log.empty().addClass('ajax-loading');
// requests of our php plus dummy as query
ajax.request(dummy);
});
// start and stop click events
start.addEvent('click', function(e) {
// prevent default
new Event(e).stop();
// prevent insane clicks to start numerous requests
$clear(periodical);
/* a bit of fancy styles */
stop.setStyle('font-weight', 'normal');
start.setStyle('font-weight', 'bold');
log.empty().addClass('ajax-loading');
/* ********************* */
// the periodical starts here, the * 1000 is because milliseconds required
periodical = refresh.periodical(timer * 1000, this);
// this is the first only request, later on will be only the periodical and refresh
// that do the request. If we don't do this way, we have to wait for 4 seconds before
// the first request.
ajax.request($time());
});
stop.addEvent('click', function(e) {
new Event(e).stop(); // prevent default;
/* a bit of fancy styles
note: we do not remove 'ajax-loading' class
because it is already done by 'onCancel'
since we later do 'ajax.cancel()'
*/
start.setStyle('font-weight', 'normal');
stop.setStyle('font-weight', 'bold');
/* ********************* */
// let's stop our timed ajax
$clear(periodical);
// and let's stop our request in case it was waiting for a response
ajax.cancel();
}); |
l'html:
Code:
1
2
3
4
5
6
7
8
9
10
11
| <div id="form_box">
<ul>
<li><a id="start" href="#">start</a></li>
<li><a id="stop" href="#">stop</a></li>
</ul>
</div>
<div id="log">
<h3>Ajax Response</h3>
<div id="log_res"><!-- spanner --></div>
</div>
<span class="clr"><!-- spanner --></span> |
Il fonctionne sur mon site mais je voulais que le script ne se lance pas sur l'action du bouton start, mais au chargement de la page.
J'ai essayé de remplacer 'click' par 'onLoad' à la ligne 25 mais rien y fait.
Voila je ne connais pas très bien JS si quelqu'un pouvait m'aider il serrait le bienvenu :yaisse2: .
La source ce trouve là:
http://demos.mootools.net/Ajax_Timed
