Avatar of Sar1973
Sar1973
Flag for Italy asked on

Cannot find the exact syntax of setTimeout with innerHTML as argument.

I am developing a very simple function that should allow me to display a countdown message:

var myTable=document.getElementById("myTable");
var myHTML0 = myTable.outerHTML;
var j=0;
var T=5;
for (g = 0; g<T; g++) {
      j = T-g;
      myMsg = "We have "+j+" seconds missing to go.";
      myHTML = myHTML0.substring(0,myHTML0.indexOf("We"))      +myMsg+myHTML0.substring(myHTML0.indexOf("We")+2,myHTML0.length);
***      var k = setTimeout("document.getElementById('myNote').innerHTML = myHTML",       g*1000);
      myHTML ="";
}
Unfortunately, I canno manage to spot the correct syntax of line ***. Can you suggest how? Thanx.
JavaScript

Avatar of undefined
Last Comment
Sar1973

8/22/2022 - Mon
leakim971

try this ;

var myTable=document.getElementById("myTable");
var myHTML0 = myTable.outerHTML;
var j=0;
var T=5;
for (g = 0; g<T; g++) {
      j = T-g;
      myMsg = "We have "+j+" seconds missing to go.";
      myHTML = myHTML0.substring(0,myHTML0.indexOf("We"))      +myMsg+myHTML0.substring(myHTML0.indexOf("We")+2,myHTML0.length);
***      var k = setTimeout("document.getElementById('myNote').innerHTML = '" + myHTML + "'",       g*1000);
      myHTML ="";
}

Open in new window


Additionaly check this : http://keith-wood.name/countdown.html
Sar1973

ASKER
I have tried these:
1. (posted) setTimeout("document.getElementById('myNote').innerHTML = myHTML", g*1000);
2. setTimeout("document.getElementById('myNote').innerHTML = '" + myHTML + "'",       g*1000);
3. setTimeout("document.getElementById('myNote').innerHTML = "+ myHTML, g*1000);
4. setTimeout("document.getElementById('myNote').innerHTML = \'myHTML\', g*1000); (or something similar).
In case 2. it says that I've inserted a string without termination, in the other cases the editor alerts of syntax errors (3.) or returns a null value (1.), so that the table gets empty; moreover it does not support jQuery.
leakim971

ok great for case 2 :

setTimeout("document.getElementById('myNote').innerHTML = '" + escape(myHTML) + "'",       g*1000);
Experts Exchange has (a) saved my job multiple times, (b) saved me hours, days, and even weeks of work, and often (c) makes me look like a superhero! This place is MAGIC!
Walt Forbes
leakim971

or :

setTimeout("document.getElementById('myNote').innerHTML = '" + myHTML.replace(/'/g, "\\'") + "'",       g*1000);
Sar1973

ASKER
Will test tomorrow and tell you, thanx in advance.
Sar1973

ASKER
"escape" does not work at all (gives unknow contents), while the other gives "string wothout termination" error as above.
⚡ FREE TRIAL OFFER
Try out a week of full access for free.
Find out why thousands trust the EE community with their toughest problems.
leakim971

please provide a direct link to see you page
Sar1973

ASKER
It's not published yet. But I'm not sure that I need to make the string portable with escape function; I should understand instead why I get "string without termination" error even if I point the HTML code with single marks.
leakim971

about your "string without termination" error :

var blabla = "some string without error";

var bloblo = "string with-----> " <------- termination error";
Experts Exchange is like having an extremely knowledgeable team sitting and waiting for your call. Couldn't do my job half as well as I do without it!
James Murphy
Sar1973

ASKER
Sorry, you are asking which is the exact error message I get?
leakim971

No, I want you understand why you get the error.
bloblo have a double quote in the string, it need to be escaped
Sar1973

ASKER
I can also tell you that without using quotes I get a blank content/value in the table in subject, while it works if I use the absolute syntax without timing "document.getElementById('myNote').innerHTML = myHTML;".
⚡ FREE TRIAL OFFER
Try out a week of full access for free.
Find out why thousands trust the EE community with their toughest problems.
leakim971

You said : << "escape" does not work at all (gives unknow contents), >>

Could you post the content here

If you can publish this page I can help you more.
Sar1973

ASKER
Escape functions returns the HTML code replacing spaces and other characters with %20 or similar: it's not what I need. Probably the code I'm using encounters troubles durign the cycle (for ex. does not refresh the k variable in time) or misses some DIV, TD, BODY or other statement or discriminates between Ucase and Lcase.
I've read on w3schools tutorial that setTimeout variables must be named with different strings, that's why I was also asking how to combine eval syntax with setTimeout syntax.
As an alternative, I could think to insert a label or another object and give it a text value equal to the string I need to display.
leakim971

>Escape functions returns the HTML code replacing spaces and other characters with %20 or similar: it's not what I need.

Could you post one generating the error?
All of life is about relationships, and EE has made a viirtual community a real community. It lifts everyone's boat
William Peck
Sar1973

ASKER
Exactly (it's a literal translation): "Line 1, character 50, string constant without termination" or "Line 2, character 1, syntax error" in the 2 mentioned cases.
leakim971

No, I want to see the string escaped :

blablabla%20blablabla
%YX

Open in new window

blablabla

the full myHTML string escaped, I mean : escape(myHTML)
leakim971

blablabla%20blablabla%YXblablabla
⚡ FREE TRIAL OFFER
Try out a week of full access for free.
Find out why thousands trust the EE community with their toughest problems.
Sar1973

ASKER
This is the original HTML:

<DIV style="WIDTH: 351px; HEIGHT: 25px" id=myNote align=left><TABLE style="DISPLAY: inline" border=0 cellSpacing=0 cellPadding=0 width=381>
<TBODY>
<TR>
<TD style="BORDER-BOTTOM: 1px solid; BORDER-LEFT: 1px solid; BORDER-TOP: 1px solid; BORDER-RIGHT: 1px solid" bgColor=#ff0000 width=383><FONT color=#ffffff face=Arial>Nota</FONT></TD></TR></TBODY></TABLE></DIV>

and this is the escaped HTML:

%0D%0A%3CDIV%20style%3D%22WIDTH%3A%20351px%3B%20HEIGHT%3A%2025px%22%20id%3DmyNote%20align%3Dleft%3E%3CTABLE%20style%3D%22DISPLAY%3A%20inline%22%20border%3D0%20cellSpacing%3D0%20cellPadding%3D0%20width%3D381%3E%0D%0A%3CTBODY%3E%0D%0A%3CTR%3E%0D%0A%3CTD%20style%3D%22BORDER-BOTTOM%3A%201px%20solid%3B%20BORDER-LEFT%3A%201px%20solid%3B%20BORDER-TOP%3A%201px%20solid%3B%20BORDER-RIGHT%3A%201px%20solid%22%20bgColor%3D%23ff0000%20width%3D383%3E%3CFONT%20color%3D%23ffffff%20face%3DArial%3ENota%3C/FONT%3E%3C/TD%3E%3C/TR%3E%3C/TBODY%3E%3C/TABLE%3E%3C/DIV%3E
ASKER CERTIFIED SOLUTION
leakim971

THIS SOLUTION ONLY AVAILABLE TO MEMBERS.
View this solution by signing up for a free trial.
Members can start a 7-Day free trial and enjoy unlimited access to the platform.
See Pricing Options
Start Free Trial
GET A PERSONALIZED SOLUTION
Ask your own question & get feedback from real experts
Find out why thousands trust the EE community with their toughest problems.
Sar1973

ASKER
It works! Good job; I know only have to fix a format trouble, since the new table appears padded left about 5 px from the original.