Brak animacji w stworzonym divie

Question

Witam,

ciężko jest wytłumaczyć więc od razu pokaże kod:

<div id="zawodnik" onclick="las();this.remove()"></div>

<script type="text/javascript">
var wynik = 0;
function las() {
   $("<div></div>").attr('id','zawodnik').attr('onclick','las();this.remove()').appendTo('body');   

		wynik++;
		document.getElementById("wynik").value=wynik;
  }
    $("#zawodnik").animate({
    left: 800
    }, 2000,  function () {

    });
	</script>

Dlaczego animacja nie jest odgrywana na nowo powstałym divie mającym taką samą nazwę? Trzeba to jakoś zapętlić?

Answer 1

onclick nie jest wskazane do podpinania zdarzenia dla elementu, jeżeli używasz jQuery to powinieneś użyć .click() / .on()

Więc, pierwsze co powinieneś usunać z diva to onclick i dla tego elementu normalnie przypisać zdarzenie, następnie całą animacje wsadzić do nowej funkcji:

function animacja() {
  $("#zawodnik").animate({
    left: 800
  }, 2000, function() {
    // koniec animacji
  });
}

( Do zdarzenia click dodaj wywołanie funckcji animacja() )

Co ma się stać gdy animacja się skonczy? Z twojego kodu wynika, że chcesz element, który został już przesunięty, usunać. Więc tam gdzie masz komentarz dodajesz this.remove() , następne pod tym tworzysz nowy element tak jak w funkcji las(), a na sam koniec wywołujesz funkcje animacja(). Wydaje mi się, że oto Ci chodziło, nieskończona animacja.

No i usun funckje las(), zbędna.