Databases
StackOverflow2013
Postsdbo
POusing Timer Controls (i.e. setTimeout) in multiple loops
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POusing Timer Controls (i.e. setTimeout) in multiple loops
    primarykey
    data
    text
    <p>I know how to display characters in news ticker type fashion (1 at a time on a delay), but I can seem to figure out how to display <strong><em>multiple</em> news items</strong>. For example:</p> <ol> <li>I have an array of strings.</li> <li>I'd like to <strong>loop through <em>each item</em></strong> in the array, and...</li> <li>and <strong>for each item</strong> (i.e. each string of text) in the array, I would <strong>then</strong> like to</li> <li><strong>loop through <em>EACH CHARACTER</em></strong> in that string and...</li> <li>display the character on screen <strong>in 70ms intervals</strong> (using setTimeout).</li> <li>Once I've reached the last character in that string, I want to jump back to the previous loop (see #2) to continue <strong>at an interval of 1 sec.</strong> (again using setTimeout).</li> </ol> <p>Below is my feeble (i.e. greenhorn) attempt at solving this problem. I can get at each string and so far just do a console.log on it. Cant seem to figure out how to steps 4 through 6.</p> <p>Somebody shed some light on this please.</p> <p>Thanks In Advance! </p> <pre><code>&lt;body&gt; &lt;p class="theText"&gt;This is test 1 of the text.&lt;/p&gt; &lt;p class="theText"&gt;This is test 2 of the text.&lt;/p&gt; &lt;p class="theText"&gt;This is test 3 of the text.&lt;/p&gt; &lt;div id="textScroller"&gt;&lt;/div&gt; &lt;script type="text/javascript"&gt; var textScroller = function(scrollContainer){ var container = document.getElementById(scrollContainer); var nodeContainer = document.getElementsByClassName('theText'); // this function gets only the nodeValues from the nodeContainer array // and puts them in an array called textArray var getTextArray = function makeTextArray(theNodeArray){ var textArray = []; for(var i=0;i&lt;nodeContainer.length;i++){ var container_text = nodeContainer[i].firstChild.nodeValue; textArray.push(container_text); } return textArray; }; var textArray = getTextArray(); /* Right now the "showText" function just logs the string of text to the console. But the function SHOULD [a] loop through each character in the CURRENT string and [b] display the current character [c] check if there are more characters and, if so... [d] display the next character in 70 milliseconds (i.e. setTimeout or setInterval) [e] if no more characters, go back to the function (loopArray) and get the next string */ function showText(theString){ console.log(theString); } // loop through and process each item in the array var l = 0; function loopArray(){ var thisString = textArray[l]; showText(thisString); if(l &lt; textArray.length -1){ setTimeout(loopArray,1000); } l++; } setTimeout(loopArray,1000); } textScroller('textScroller'); &lt;/script&gt; &lt;/body&gt; </code></pre>
    singulars
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. PTQuestion
    1. USsleeper
    1. USsleeper
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. PO
      singulars
      1. PTAnswer
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance
A row detail

Detail views are divided into sections. All the information in the data section comes from columns in the selected row. The other sections display data from other, related rows.

Related data can be related in a to-one or a to-many fashion. Captions of data related in a to-many fashion link to a list view showing a filtered view of the table.

Try moving around until you find a non-empty to-many entry and click on the label to get to one. You can move back to the root by clicking on the database name in the header.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload