el html es :
Código:
mientras que el javascript es . <aside id="carritocompra" ondrop="drop(event)" ondragover="allowDrop(event)"> <!--Imágenes imagen--> <img src="imagen1.jpg" id="drag1" draggable="true" data-precio="34€"ondragstart="drag(event)" ondragend="acabarend(event)" with="30%" > <img src="imagen2.jpg" id="drag2" draggable="true" data-precio="34€"ondragstart="drag(event)" ondragend="acabarend(event)"with="30%" > <img src="imagen3.jpg" id="drag3" draggable="true" data-precio="34€"ondragstart="drag(event)" ondragend="acabarend(event)" with="30%" > <img src="imagen4.jpg" id="drag4" draggable="true" data-precio="34€"ondragstart="drag(event)" ondragend="acabarend(event)" with="30%"> <img src="imagen5.jpg" id="drag5" draggable="true" data-precio="34€"ondragstart="drag(event)" ondragend="acabarend(event)" with="30%" > <img src="imagen6.jpg" id="drag6" draggable="true"data-precio="34€" ondragstart="drag(event)" ondragend="acabarend(event)" with="30%" > </aside> <section id="cestacompleta" > <div id="cesta" ondrop="drop(event)" ondragover="allowDrop(event)" width:"80%">cesta </div> <div id="precio">precio </div> <div id="total" >total</div> </section>
Código:
por mas vueltas que ve mirado en webs, video... no consigo encontrar el error unction allowDrop(ev) { ev.preventDefault(); } function drag(ev) { ev.dataTransfer.setData("text", ev.target.id); } function drop(ev) { ev.preventDefault(); var data = ev.dataTransfer.getData("text"); ev.target.appendChild(document.getElementById(data)); return false; } function clonar(ev){ var elementoArrastrado = document.getElementById(ev.dataTransfer.getData("Data")); // Elemento arrastrado elementoArrastrado.style.opacity = ''; // Dejamos la opacidad a su estado anterior para copiar el elemento igual que era antes var movecarclone = elementoArrastrado.cloneNode(true); // Se clona el elemento movecarclone.id = "ElemClonado" + contador; // Se cambia el id porque tiene que ser unico contador+=1; elementoClonado.style.position = "static"; ev.target.appendChild(movecarclone); // Se añade el elemento clonado //sin estas sentencias funciona el mover , pero si las pongo no me funciona el programa, var precio=movercarclone.getAttribute("data-precio"), var miparcial=document.getElementById("precio"); var mitotal=document.getElementById("total"); miparcial.innerHTML=miparcial.innerHTML+data+precio+"</br>"; preciototal=preciototal+parseInt(precio); preciototal.innerHTML="Total compra:"+preciototal+"€"; }
el javascirpt funciona si no pongo a partir de : /sin estas sentencias funciona el mover , pero si las pongo no me funciona el programa,
en el momento que intento hacer que se clone y luego sumar los productos deja de funcionar. solo puedo usar html, css , javascript
por favor ayudarme, no se donde esta el error y ya no se que hacer, muchisimas gracias por ayudarme maestros,
un saludo