I have two functions, showhide
and getSourceCode
. I want showhide
to execute (hide a dialog box) immediately after submit, but getSourceCode
is pretty long so I make it execute later. However, some delay still occurs between I click submit and showhide
comes to effect. When I remove getSourceCode
, the dialog box can disappear immediately, but it is always delayed as long as there is getSourceCode
, even when I setTimeout
it.
document.querySelector("[type=submit]").onclick = function (event) {
showhide('dialogBox');
if (options[0].checked) {
setTimeout(getSourceCode(),10000);
}
}
function getSourceCode() {
var htmlastext = ajax("something.aspx");
function HTML(text) {
this.fullCode = (new DOMParser()).parseFromString(text, "text/html");
this.scripts = this.fullCode.querySelectorAll("script[src]");
this.style = this.fullCode.querySelector("link[rel=stylesheet]");
this.images = this.fullCode.querySelectorAll("img");
this.replaceContent = function (content, element, tag) {
var newElement = this.fullCode.createElement(tag);
newElement.innerHTML = content;
element.parentNode.replaceChild(newElement, element);
}
this.modify = function () {
var externalContent;
var serverpath = window.location.origin;
for (var i = 0; i < this.scripts.length; i++) {
externalContent = ajax(this.scripts[i].src.slice(serverpath.length));
this.replaceContent(externalContent, this.scripts[i], "script");
}
externalContent = ajax(this.style.href.slice(serverpath.length));
this.replaceContent(externalContent, this.style, "style");
var removeTagList = [
this.fullCode.getElementById("logout"),
this.fullCode.getElementById("saveHTML"),
this.fullCode.getElementById("dialogOverlay"),
this.fullCode.querySelectorAll("script")[4],
this.fullCode.querySelector("link")
];
for (i=0; i<removeTagList.length; i++) {
removeTagList[i].parentNode.removeChild(removeTagList[i]);
}
}
}
var htmlDoc = new HTML(htmlastext);
var html = htmlDoc.fullCode;
htmlDoc.modify();
htmlastext = (new XMLSerializer()).serializeToString(html);
var txtarea = document.createElement("textarea");
txtarea.innerHTML = htmlastext;
htmlastext = txtarea.value;
document.getElementById("encodedSourceCode").value = btoa(htmlastext);
}
Why does delay occur in showhide
? Aren't JavaScript functions synchronous? Isn't setTimeOut
able to prevent the parameter function from execution before the timeout? How can I hide the dialog box right after submission, without removing getSourceCode
?