Javascript Timer

Question

So I am trying to make a timer that puts a letter from a word submitted into an input every second.

Something like this. Assuming the string "matsumoto" were entered, the output would be: 1. m 2. ma 3. mat 4. mats 5. matsu 6. matsum 7. matsumo 8. matsumot 9. matsumoto

All I have really done before is a timed alert. If anyone could help me out or give me a starting point i would greatly appreciate it!

possible duplicate of [Simulate scrolling text in javascript](http://stackoverflow.com/questions/11656980/simulate-scrolling-text-in-javascript) — Bergi, Dec 11 '12 at 20:32
Couldn't post as answer, because it was closed, but here is something that may help -- http://jsfiddle.net/jmsessink/vCWPv/ — JSess, Dec 11 '12 at 20:59

score 1 · Answer 1 · answered Dec 11 '12 at 20:35

Something like

var str = 'matsumoto';
var inp = document.getElementById('your element id');
var index = 0;
var hnd = setInterval(function()
{
    inp.value += str[index++];

    if (index == str.length)
        clearInterval(hnd);
}, 1000);

Should do the trick. This creates a variable to hold your string, gets a reference to the input element to fill with the characters, then sets a starting index. The setInterval method is then called every 1000 milliseconds (i.e. one second), and will add the character at the current index to the input element. The index is then incremented, and tested against the length of the string, if they match, we've finished so we use the clearInterval method to stop the timer.

To make my question more clear. This is what i would like to do. JavaScript function that writes successive prefixes of the value entered into a web page text field into a span element, one after another, starting with the first prefix, which is zero characters long. Use a timer that will add each item in 1 sec intervals. I have looked at W3 schools the thing I am having an issue with is getting them to appear one after the other. — user1825293, Dec 11 '12 at 21:26

score 0 · Answer 2 · answered Dec 11 '12 at 20:35

0

This could help you, W3c JavaScript Timing Events:

http://www.w3schools.com/js/js_timing.asp

answered Dec 11 '12 at 20:35

Pablo Rebolini

33
5

Javascript Timer

2 Answers2