[JavaScript]Dodawanie kolejnych textboxów po kliknięciu na button Opcje

[danon198901]

Witam,

z javascript miałem bardzo mało do czynienia (głównie PHP), ale uczę się na bieżąco robiąc własne projekty. W chwili obecnej mam ciężki orzech do rozgryzienia. Chciałbym dodać opcję, że po kliknięciu użytkownikowi pojawiają się 2 nowe textboxy obrazujące współrzędne 'x' oraz 'y'.

A więc jest sobie na stronce button po kliknięciu na który textboxy mają być dodawane i kolejno otrzymywać inne name oraz id (np.: x1,x2,y1,y2 itd) ze względu na dalszą obsługę przez interpreter php. Czyli pierwsze kliknięcie = jeden textbox X oraz Y. Dziesięć kliknięć na button = 10x textbox X oraz 10x textbox Y.

Z wcześniejszego tematu na forum dowiedziałem się mniej więcej jak dodawać przez JS elementy HTML - jednak nadal nie do końca to "kminię".

Przykładowy kod dodający buttona, wyszperany w sieci:

[HTML] pobierz, plaintext 
<button onclick="myFunction()">Try it</button>
 
<script>
 
function myFunction()
{
var btn=document.createElement("BUTTON");
var t=document.createTextNode("CLICK ME");
btn.appendChild(t);
document.body.appendChild(btn);
};
 
</script>
[HTML] pobierz, plaintext 

Mi chodzi dokładnie o coś takiego, z tym, że chcę, aby kolejne textboxy otrzymywały inne 'name' oraz 'id'. Może ktoś zna jakiś ciekawy tutorial odnośnie tego zagadnienia, bo ja się w google naszperałem, a w kursach online po prostu tego brakuje.

[danon198901]

Tak samo. Niezależnie od tego czy jest to element zamykany od razu <br /> czy taki, który może mieć dzieci <div>, </div> robisz tak samo.

No ok, ale na przykładzie center:

[PHP] pobierz, plaintext 
var cent = document.createElement("CENTER");
	document.body.appendChild(obj);
	document.body.appendChild(objSec);
	var ent = document.createElement("BR");
	document.body.appendChild(ent);
[PHP] pobierz, plaintext 

skąd skrypt będzie wiedział kiedy zamknąć <center> ? Pewnie ja nie rozumuję poprawnie. createElement tworzy element, zaś fizycznie wstawienie go odbywa się poprzez appendChild tak? Zatem jeśli zaraz po zadeklarowaniu zmiennej cent umiejscowie appendChild wówczas powinno odbyć się 'wyśrodkowanie' wszystkiego tak? Bo generalnie wstawiam to i mimo wszystko nic nie wyśrodkowuje...no i co z elementem zamykającym? Wtedy zrobić var cent = document.createElement("/CENTER");

Poza tym, możesz też operować na innerHTML, coś a la:
document.body.innerHTML += '<input type="text" size="2" maxlength="2" style="position:absolute;left:500px;top:500px" id="od' + licznik + '" />';

Oooo to jest coś bardziej czytelnego i zrozumiałego. Wrzuciłem prosty test i niestety, ale po zastosowaniu funkcji innerHTML i kliknięciu na button moim oczom okazuje się nowa strona zastępująca poprzednią, a co za tym idzie nie mam możliwości po raz kolejny klikania na button czy wpisywaniu dalszych informacji.