javascript - place a div just below a textbox -


i have searched lot didn't got result satisfying, trying div below text using javascript autocomplete textbox

<input type="text" id="one" onkeyup="suggest(event,this)" /> <p> <input type="text" id="two" onkeyup="suggest(event,this)" /> <p> <input type="text" id="two" onkeyup="suggest(event,this)" />  javascript: function suggest(e,the) {     //here want create div , place below textbox on keyispressed }  help! 

in general not idea attach javascript events html. idea dynamically create div , position below input field think following code work. here jsfiddle http://jsfiddle.net/krasimir/qcxpu/3/

<div class="wrapper"> <input type="text" id="one" class="suggest" /> <p>some text</p> <input type="text" id="two" class="suggest" /> <p>some text</p> <input type="text" id="three" class="suggest" /> </div> 

javascript:

var inputs = document.queryselectorall('.suggest'); for(var i=0; field=inputs[i]; i++) {     field.addeventlistener('keyup', function(event) {         var text = 'you typed: ' + this.value;          if(!this.suggestion) {             var rect = this.getboundingclientrect();             var left = rect.left;             var top = rect.bottom;             this.suggestion = document.createelement('div');                         this.suggestion.innerhtml = text;             this.suggestion.setattribute('style', 'background: #b0b0b0; padding: 6px; position: absolute; top: ' + top + 'px; left: ' + left + 'px;');             this.parentnode.appendchild(this.suggestion);         } else {             this.suggestion.innerhtml = text;             this.suggestion.style.display = 'block';         }              });     field.addeventlistener('blur', function(event) {         if(this.suggestion) {             this.suggestion.style.display = 'none';         }     }); } 

Comments

Popular posts from this blog

java - activate/deactivate sonar maven plugin by profile? -

python - TypeError: can only concatenate tuple (not "float") to tuple -

java - What is the difference between String. and String.this. ? -