Hi, im really noob at this coding and i really need your help. I got this odd text boxes to work as i expected, but this onblur event only seems to work after i change the dropdown selection for the first time, after that everything works fine.
Please try running this HTML:
I need help to fix it so if a user clicks there but dont want to change the dropdown selection it'll disappear back again. I tried alot of things without sucess.Code:<html> <head> <style type="text/css"> body {font-family: verdana;font-weight:bolder;font-size:8pt;background-color: white; color: #3366CC; background-image:url(imgs/trl.gif); background-position: 62% 55px; background-repeat:no-repeat;} input {border: 1px solid #999999;font-size: 12px;} .i1 {width: 320px;min-height: 20px;padding-top: 3px; padding-left: 5px;font-size: 11px; z-index:0;} .i2 {width: 140px;min-height: 19px;font-size: 9px; z-index:1;} .b {font-weight:bolder;} .e1 {position:relative;top:-63px;left:0px;z-index:10;font-size:24pt; color:#FF0000; display:none;-moz-user-select: none;-khtml-user-select: none;user-select: none; border:hidden;} .x2 {font-size: 9px;} .ly1 {display: block;} .ly2 {display: none;} .htable {position:relative;top:0px;right:0px;z-index:1;} </style> <script lng = "JavaScript" type="text/javascript"> function showOrHide(value) { if (value==0) { document.getElementById('l1').style.display='none'; document.getElementById('l2').style.display='block'; document.getElementById('l5').style.display='inline'; document.getElementById("sln").focus(); } else if ((value==1) && (document.getElementById('sln').value=="")) { document.getElementById('l1').style.display='block'; document.getElementById('l2').style.display='none'; document.getElementById('l5').style.display='none'; } else if (value==2) { document.getElementById('l5').style.top='-70px'; document.getElementById('l3').style.display='none'; document.getElementById('l4').style.display='block'; document.getElementById("lng").focus(); } else if (value==3) { document.getElementById("l3").innerHTML = ('em '+ SLN); document.getElementById('l5').style.top='-63px' document.getElementById('l3').style.display='block'; document.getElementById('l4').style.display='none'; } return false; } function kct1(event){ if(document.getElementById('qs').value!=='') { showOrHide(0); } return; } function kct2(event){ showOrHide(2); document.getElementById("lng").focus(); return; } </script> </head> <BODY marginheight='150px' onload="document.getElementById('qs').focus(); vclear();" style="overflow: hidden;"> <form onsubmit="return checkform(this);"> </td><td width="15%"></td></tr></tbody></table> <center> <table border="0" width="25%"><tbody> <tr><td>Pesquisar</td></tr> <tr><td><input class="i1" maxlength="2048" id="qs" onkeydown="if(event.keyCode==9){kct1();return false}"/></td></tr> <tr><td class="x2"> <div class="ly1" id="l1" onmousedown="showOrHide(0);" style="max-width:100px">Excluir da Pesquisa</div> <div class="ly2" id="l2"><input class="i1" style="color:#FF0000" id='sln' maxlength="2048" onblur="showOrHide(1)" onkeydown="if(event.keyCode==9){kct2();return false}"/></div></td></tr> <tr><td class="x2"><div class="ly1" id="l3" onmousedown="showOrHide(2);" style="max-width:110px">em português (Brasil)</div> <div class="ly2" id="l4" onBlur="showOrHide(3);"><select class="i2" id="lng" onChange="SLN=[this.options[this.selectedIndex].text];showOrHide(3);"><option label="africâner" value="af">africâner</option><option value="sq">albanês</option><option value="de" class="b">alemão</option><option value="am">amárico</option><option value="ar">árabe</option><option value="hy">armênio</select></div></td></tr> <tr><td><div class="e1" id="l5">-</div></td></tr> </tbody></table></form> </center> </body> </html>
Also any tips to improve the code will be very appreciated.
Thanks in advance.
- bvaroni



Reply With Quote
Bookmarks