roli roli roli roli - 27 days ago 6
Javascript Question

Clear innerHTML after 5 seconds

I have the below code It works fine but I want to clear the innerHTML after 5 seconds. Not every 5 sec but when it appears, it is cleared again after 5 seconds. Once!



function myfunction() {
var x = document.forms["forma"]["emri"].value;
var x1 = document.forms["forma"]["mbiemri"].value;
var x2 = document.forms["forma"]["email"].value;
var x3 = document.forms["forma"]["vendbanimi"].value;
if ((x == null || x == "") || (x1 == null || x1 == "") || (x2 == null || x2 == "") || (x3 == null || x3 == "")) {
document.getElementById("js").innerHTML = "Ju lutem ploresojini te gjitha te dhenat";
return false;
}
if (x2.indexOf("@") < 1) {
document.getElementById("js").innerHTML = "Ju lutem insertoni nje email te sakte";
return false;
}
}

<div class="forma">
<center>
<form class="form-orizontal" method="post" name="forma">
<div class="input-prepend">
<span class="add-on">e</span>
<input class="span2" id="prependedInput" type="text" placeholder="emri" name="emri">
</div>
<br>
<div class="input-prepend">
<span class="add-on">mb</span>
<input class="span2" id="prependedInput" type="text" placeholder="mbiemri" name="mbiemri">
</div>
<br>
<div class="input-prepend">
<span class="add-on">@</span>
<input class="span2" id="prependedInput" type="text" placeholder="email" name="email">
</div>
<br>
<div class="input-prepend">
<span class="add-on">vb</span>
<input class="span2" id="prependedInput" type="text" placeholder="vendbanimi" name="vendbanimi">
</div>
<br>
<div class="input-prepend">
<span class="add-on">V</span>
<select name="viti_lindjes" class="small">
<option style="display:none">Viti i lindjes</option>
<option>1990</option>
<option>1991</option>
<option>1992</option>
<option>1993</option>
<option>1994</option>
<option>1995</option>
<option>1996</option>
<option>1997</option>
</select>
</div>
<div class="control-group">
<div class="controls">
<button type="submit" class="btn" name="submit" onclick="return myfunction()">Submit</button>
<input type="reset" class="btn">
</div>
</div>
<div id="js"></div>
</form>
</center>
</div>




Answer

setTimeOut function waits for you

function appearing(){
  document.getElementById("inner").innerHTML = "Paragraph changed!";
  setTimeout(function(){ 
      document.getElementById("inner").innerHTML = "";
  }, 5000);
}
<a href='#' onClick='appearing()'>Appear and disapper after 5 seconds</a>
<div id='inner'></div>