niche Posted December 9, 2011 Share Posted December 9, 2011 How do I keep the red divs from building up (one under another) with each onclick event? I tested variations of removeChild(div) without success. Is removeChild(div) part of the answer and I'm just using it wrong or is there a better approach? <html><head><script type="text/javascript">function showHint(str) { if (str.length==0) { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else { // code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatechange=function() { if (xmlhttp.readyState==4 && xmlhttp.status==200) { var div = document.createElement('div'); div.setAttribute('id', 'link_container'); div.setAttribute("style","background-color:red;"); //div.style.backgroundColor = 'red'; div.style.width = '300px'; div.style.height = '100px'; div.style.margin = '-15px 0px 0px 75px'; //var txt=document.innerHTML=xmlhttp.responseText; var txt=xmlhttp.responseText; var strA = txt.slice(0,txt.indexOf(",")); //define number of cycles of For Loop var str = txt.substr(txt.indexOf(",")+1); //cut 1st position from string and save remaining info for (i=0; i<=strA; i++){ var newLink = document.createElement('a'); //create anchor var linkName = str.slice(0,str.indexOf(" ,")+1); var linkName = linkName.split(' ').join(''); newLink.href = "http://localhost/" + linkName+".php"; newLink.innerHTML = linkName; var str = str.substr(str.indexOf(",")+1); div.appendChild(newLink); var newBr = document.createElement('br'); //create break div.appendChild(newBr); } document.getElementsByTagName('body')[0].appendChild(div); } } xmlhttp.open("GET","gethint.php?q="+str,true); xmlhttp.send();}</script></head><body> <p><b>Start typing a name in the input field below:</b></p> <form> First name: <input type="text" onkeyup="showHint(this.value)" size="20" /> </form> </body></html> Link to comment Share on other sites More sharing options...
ShadowMage Posted December 9, 2011 Share Posted December 9, 2011 I would test for the existence of the div and only create it if it doesn't exist: if (!document.getElementById('link_container')) { ...Code to create the div...} Link to comment Share on other sites More sharing options...
niche Posted December 9, 2011 Author Share Posted December 9, 2011 Thanks again shadowMage. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.