How to dynamically create and position a textbox in javascript? - Stack Overflow

admin管理员组

文章数量:1432205

I would like to dynamically create a text box then dynamically position the text box. I have been able to dynamically create the text box with no problem but I have not been able to figure out how to position it. Any suggestions?

I would like to dynamically create a text box then dynamically position the text box. I have been able to dynamically create the text box with no problem but I have not been able to figure out how to position it. Any suggestions?

• javascript

Share Improve this question Follow edited Sep 30, 2009 at 13:43 Joel Coehoorn 417k114114 gold badges578578 silver badges815815 bronze badges asked Sep 30, 2009 at 13:38 Weston GoodwinWeston Goodwin 34355 silver badges1717 bronze badges 1

• Please try to make your question titles meaningful. "Javascript question" is not going to be of much use to someone searching the archives. – Buggieboy Commented Sep 30, 2009 at 14:05

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 2

Set the "top" and "left" positions? You may also need to set the "position" property to be "relative" or "absolute", depending on what you want to do.

var box = document.createElement('input'); // creates the element

box.style.position = 'absolute';  // position it
box.style.left = '100px';
box.style.top = '100px';  

document.body.appendChild(box); // add it as last child of body elemnt

If you want to add it somewhere else in the document hierarchy you have to find the parent using getElementById and use that elements appendChild function.

Position where?

Are you trying to position at some specific point or inside some other element? Try using position: absolute either in the CSS for your textbox class or use the style property on the object in the DOM.

There's a trick to positioning elements using javascript:

var el = document.getElementById('myelementID');
el.style.left = 10 + "px";
el.style.top = 10 + "px";

Note the ' + "px"' part of that. You need to make sure the expression is a string with units before the assignment takes place or it won't work reliably. You can also use the offsetTop and offsetLeft properties instead of the style, but the "string with units" rule still applies.

本文标签： How to dynamically create and position a textbox in javascriptStack Overflow