I found this js stopcounter and I would like to add it in multiple input fields in the same page depended an id varible, I suppose that is easy but how can I do that? e.g
<input type="text" id="1" value="" />
<input type="button" value="Start/Stop" onclick="startstoptimer(1)">
<input type="reset" onclick="resettimer(1)">
<input type="text" id="2" value="" />
<input type="button" value="Start/Stop" onclick="startstoptimer(2)">
<input type="reset" onclick="resettimer(2)">
and so on...
The original code is
<head>
<script>
<!--
var millisec = 0;
var seconds = 0;
var timer;
function display(){
if (millisec>=9){
millisec=0
seconds+=1
}
else
millisec+=1
document.d.d2.value = seconds + "." + millisec;
timer = setTimeout("display()",100);
}
function starttimer() {
if (timer > 0) {
return;
}
display();
}
function stoptimer() {
clearTimeout(timer);
timer = 0;
}
function startstoptimer() {
if (timer > 0) {
clearTimeout(timer);
timer = 0;
} else {
display();
}
}
function resettimer() {
stoptimer();
millisec = 0;
seconds = 0;
}
-->
</script>
</head>
<body>
<h5>Millisecond Javascript Timer</h5>
<form name="d">
<input type="text" size="8" name="d2">
<input type="button" value="Start/Stop" onclick="startstoptimer()">
<input type="reset" onclick="resettimer()">
</form>
</body></html>
I tried this but does not work well. The error is ( Cannot set properties of null (setting 'value'))
<!--
var millisec = 0;
var seconds = 0;
var timer;
var id;
function display(id){
if (millisec>=9){
millisec=0
seconds+=1
}
else
millisec+=1
//document.id.value = seconds + "." + millisec;
document.getElementById(id).value = seconds + ":" + millisec ;
timer = setTimeout("display(id)",100);
}
function starttimer(id) {
if (timer > 0) {
return;
}
display(id);
}
function stoptimer(id) {
clearTimeout(timer);
timer = 0;
}
function startstoptimer(id) {
if (timer > 0) {
clearTimeout(timer);
timer = 0;
} else {
display(id);
}
}
function resettimer(id) {
stoptimer(id);
millisec = 0;
seconds = 0;
}
-->
</script>```