jquery - online - sistema de encuestas laravel

Eventos que no se registran después de reemplazar con

Question

Cuando replaceWith un elemento para sacar uno del DOM, luego replaceWith nuevo, los eventos registrados no se replaceWith . Necesito eventos para permanecer intacto.

Aquí está mi Javascript:

var replacement = $(document.createElement(''span''));
var original = $(this).replaceWith(replacement);

replacement
    .css(''background-color'', ''green'')
    .text(''replacement for '' + $(this).text())
    .click(function() {
        replacement.replaceWith(original);
    });

Demo en vivo

En la demostración, cuando hace clic en un elemento, se reemplaza con otro elemento utilizando replaceWith . Cuando hace clic en el nuevo elemento, se reemplaza con el elemento original usando replaceWith . Sin embargo, el controlador de clic ya no funciona (donde creo que debería).

Answer 1

Porque cuando reemplaza el elemento original, los eventos vinculados a él se eliminan. Deberá volver a adjuntar el controlador de eventos de click en el original después de la llamada a replacement.replaceWith(original) :

$(function() 
{   
   function replace() 
   {
      var replacement = $(document.createElement(''span''));
      var original = $(this).replaceWith(replacement);

      replacement
         .css(''background-color'', ''green'')
         .text(''replacement for '' + $(this).text())
         .click(function() 
         {
            replacement.replaceWith(original);
            original.click(replace);
         });
   }

   $(''.x'').click(replace);
});

Answer 2

eventos en vivo son lo que buscas

Answer 3

ACTUALIZACIÓN : live() y bind() han quedado en desuso, a favor de on() .

Puedes usar los eventos en live() y bind() , este es tu nuevo código:

$(function() {
$(''.x'').live(''click'', function() {
    var replacement = $(document.createElement(''span''));
    var original = $(this).replaceWith(replacement);

    replacement
        .css(''background-color'', ''green'')
        .text(''replacement for '' + $(this).text())
        .bind(''click'', function() {
            replacement.replaceWith(original);
        });
});
});

-El evento en vivo funciona con jQuery 1.3 y superior.

-Si desea detener la propagación en vivo use la función die() .