Question

Basically what I am trying to do is Click on a link, have it change, then by itself, change back. Below, is the current code I am using. This code was found on here but I couldn’t find out how to add the setTimeout() to the function.

function changeText(idElement) {
var element = document.getElementById('element' + idElement);
if (idElement === 1) {
    if (element.innerHTML === 'Request') element.innerHTML = 'Request Submitted!';
    else {
        element.innerHTML = 'Request';
    }
  }
}

Now, That is allowing them to click on that link, change it to ‘Request Submitted!’ and then click it again to change it back to ‘Request’. How could I put a timer on it to have it switch back to ‘Request’ automatically?

Thanks!

Answer 1

function changeText (idElement, reset) {
    var element = document.getElementById('element' + idElement);
    if (idElement === 1) {            
        var newText = (element.innerHTML === 'Request' && !reset) ? 'Request Submitted!' : "Request";
        element.innerHTML = newText; 
        if (element.timer) {
            window.clearTimeout(element.timer);
        }
        if (newText !== 'Request') {
            element.timer = window.setTimeout( function(){ changeText(idElement, true); }, 1000); };   
        }
    }
}