Forum PHP Romania - Discutii despre PHP, MySQL, Javascript, AJAX, etc

cristiluc · Data înscrierii: 25/Iun/2008 Mesaje: 18

salut
am 2 div-uri in care se afla cate un obiect reprezentand un gadget care va fi introdus in pagina. as vrea sa pot inversa pozitiile celor 2 gadget-uri insa prin simpla inlocuire a campurilor innerHTML se pierd observerii si am citit ca nu e recomandat asa ceva. am incercat sa modific campurile firstChild, dar nu imi este permis. cum as putea proceda?
va multumesc pt ajutor

vectorialpx · Trimis: Sâm Aug 16, 2008 3:21 pm Titlul subiectului:

Citat: insa prin simpla inlocuire a campurilor innerHTML se pierd observerii si am citit ca nu e recomandat asa ceva.

nu stiu ce e cuvantul ala dar... poti sa folosesti cu succes innerHTML, cu o variabila temporara

variabila1 = div1.innerHTML
div2.innerHTML = div1.innerHTML
div2.innerHTML = variabila1

si, cam asta e

adix · Data înscrierii: 02/Oct/2007 Mesaje: 123

vectorialpx a scris: Citat: insa prin simpla inlocuire a campurilor innerHTML se pierd observerii si am citit ca nu e recomandat asa ceva.

nu stiu ce e cuvantul ala dar... poti sa folosesti cu succes innerHTML, cu o variabila temporara

variabila1 = div1.innerHTML
div2.innerHTML = div1.innerHTML
div2.innerHTML = variabila1

si, cam asta e

Observerii aia sunt de fapt evenimentele atasate.

ar trebui sa aibe o structura de felul asta sa mearga

Cod: <div class="parent1">
<div id="child1">Continut div 1</div>
</div>

<div class="parent2">
<div id="child2">Continut div 2</div>
</div>

Apoi, vei avea un script de genul asta:

Cod: <script type="text/javascript">
var child1 = $('child1');
var child2 = $('child2');

var parent1 = child1.parentNode;
var parent2 = child2.parentNode;

paren1.removeChild(child1);
paren2.removeChild(child2);

parent1.appendChild(child2);
parent2.appendChild(child1);
</script>

Ma rog, asta e ideea, scriu aici fara sa testez, dar asta e principiul.

vectorialpx · Trimis: Sâm Aug 16, 2008 3:58 pm Titlul subiectului:

Citat: Observerii aia sunt de fapt evenimentele atasate.
aham... nu stiam ca se pierd evenimente cu innerHTML. Nu stiu daca jquery are vr-o solutie pentru asta sau html() e doar o prescurtate a lui innerHTML. [oricum, am nota 5 la javascript]

adix · Data înscrierii: 02/Oct/2007 Mesaje: 123

vectorialpx a scris: Citat: Observerii aia sunt de fapt evenimentele atasate.
aham... nu stiam ca se pierd evenimente cu innerHTML. Nu stiu daca jquery are vr-o solutie pentru asta sau html() e doar o prescurtate a lui innerHTML. [oricum, am nota 5 la javascript]

innerHTML copie doar codul html dintr-un tag in altul, practic textul pe care il scrii tu intre doua taguri, cu tot cu tagurile copii. Evenimentele le copioe doar daca sunt declarate inline, altfel nu are cum sa stie de ele.

mihaitha · Data înscrierii: 04/Mai/2007 Mesaje: 1762 Locaţie: Sibiu

adix, oare cu outerHTML ar merge? Teoretic ar trebui sa copieze si evenimentele atasate, daca nu sunt declarate via JS.

hunt_h_er · Data înscrierii: 14/Sep/2006 Mesaje: 95

Daca vrei sa schimbi pozitiile la nivel de prezentare (css) poti sa schimbi (add, remove) clasele parintilor..

Altfel, daca nu poti face asta, depinde ce ai tu pe acolo..

adix · Data înscrierii: 02/Oct/2007 Mesaje: 123

mihaitha a scris: adix, oare cu outerHTML ar merge? Teoretic ar trebui sa copieze si evenimentele atasate, daca nu sunt declarate via JS.

Nu, e similar cu innerHTML.

Ambele fac referinta doar la text, nu tin cont de altceva.

Dar intrebarea de mai sus este foarte buna, la ce ai nevoie de asta, sigur exista o solutie mai buna.

dechim · Trimis: Lun Aug 18, 2008 3:22 pm Titlul subiectului:

Nu stiu de ce nu reusesti, iata :
Cod:
<html>
<head>
<style type="text/css">
.parent1 { background-color: #ffff00;}
.parent2 { background-color: #00ffff; }
</style>

<script type="text/javascript">
function changepos(id1, id2)
{
var child1 = document.getElementById(id1);
var child2 = document.getElementById(id2);
var parent1 = child1.parentNode;
var parent2 = child2.parentNode;
parent1.appendChild(child2);
parent2.appendChild(child1);
parent1.removeChild(child1);
parent2.removeChild(child2);
}

function click1() { alert('CHILD 1'); }
function click2() { alert('CHILD 2'); }

</script>
</head>

<body>
<div class="parent1">
<div id="child1">
<br />Continut div 1 (click)<br /> 
</div>
</div>

<div class="parent2">
<div id="child2">
<br />Continut div 2 (click)<br /> 
</div>
</div>

<input type="button" name="change" value="Change" onclick="changepos('child1','child2');" />

<script type="text/javascript">
// se "ataseaza" cate un eveniment fiecarui div
document.getElementById('child1').addEventListener('click',click1,false);
document.getElementById('child2').addEventListener('click',click2,false);
</script>
</body>
</html>

Dupa "Change" div-urile isi schimba pozitia, CSS-ul ramane neschimbat fiind al parintilor.
Evenimentele atasate se pastreaza pentru fiecare copil.
Cred ca merge sa schimbi si CSS-ul parintilor dar nu despre asta era vorba.
Eu am incercat pe FireFox.

cristiluc · Data înscrierii: 25/Iun/2008 Mesaje: 18

va multumesc tuturor pt solutii, pana la urma am reusit cu remove urmat de update. s-au pastrat evenimentele si merge si pe IE

PHPRomania Bot · Mie Dec 26, 2007 7:01 pm