I am new to Js. I have this problem, where I have this function below. I need to disable the next button for a 3 seconds count and re-enable it. The -> button is part of a progress bar at the bottom of the page. I cannot do so without creating a new button next to the disable button.
function goToPage( num )
{
if (debugOn) { debug( “goToPage( ” + num + ” )” ); }
// When new page is selected, save last lesson, sublesson and page (so user can go back if we make it so)
lastLesson = onLesson;
lastSublesson = onSublesson;
lastPage = onPage;
// Then store the current sublesson and reset the page
onPage = num;
var pageHTML = “”;
var numOfPages = lessons[onLesson][onSublesson][“pages”];
// If we’re going to page 1, disable the back button.
if ( num == 1 )
{
pageHTML = “<button disabled=’disabled’><-</button>”;
}
// If we’re going to a page above page 1, then enable the back button
else
{
pageHTML = “<button onclick=’goToPage( ” + (num – 1) + ” )’><-</button>”;
}
// This is the text on the page control inbetween buttons
pageHTML += ” page “;
/*
* This “select” HTML generates a drop-down list of pages for the current sublesson
* Any time a different value is chosen for the drop-down, we will trigger “goToPage”
* parseInt( this.value ) returns the value of the selected option as an integer
*/
pageHTML += “<select id=’pagelist’ onchange=’goToPage( parseInt(this.value) )’>”;
for ( var i = 1; i < (numOfPages+1); i++ )
{
if ( i == num )
{
// The current page is “num” — we want that to be the selected option (what page user is currently on) pageHTML += “<option value='” + i + “‘ selected=’selected’>” + i + “</option>”;
}
else
{
// No other page will be selected
pageHTML += “<option value='” + i + “‘>” + i + “</option>”;
}
}
pageHTML += “</select>”;
pageHTML += ” of ” + numOfPages;
// If we’re on the last page of this sublesson, disable the forward button
if ( num == numOfPages )
{
pageHTML += “ <button disabled=’disabled’>-></button>”;
}
// If we’re not on the last page, enable the forward button -Special request to disable button for 3 secs.
else
{
<!– Liliane added 31 Jan 07 –>
// Disable button on click
[COLOR=”Red”]pageHTML += “ <button disabled=’disabled’>-></button>”;
[COLOR=”Red”]setTimeout(‘alert(“in timeout”)’, 3000);[/COLOR]
[COLOR=”Black”]// Display the next page of sublesson[/COLOR]
pageHTML += “ <button ‘goToPage( ” + (num + 1) + ” )’>-></button>”;[/COLOR]}
// Set the div with an id of “pages” to the new page control that was just generated
document.getElementById( “pages” ).innerHTML = pageHTML;
if (debugOn) { debug( “L” + (onLesson + 1) + ” S” + (onSublesson+1) + ” P” + num ); }
}