mon code jquery ne fonctionne pas?

Question

UCCN1003

Modifier

<script type="text/javascript"> 
    $(function(){ 
     $('a.edit').click(function(event){ 

      var change = $(this).parent('div').find('p'); 
      var changeText = change.text(); 
      var wrapper = $(this).parent('div'); 
      var clone = change.clone(true); 

      var changeBox = $(this).parent('div').find('.editBox'); 
      var changeBoxText = changeBox.val(); 
      if($(this).text() == 'Edit'){ 
       wrapper.prepend("<input class='editBox' type='text' value='"+ changeText + "'/>"); 
       wrapper.append("<a href='#' class='save' style='margin-left:10px' >Save</a>"); 
       change.remove(); 
       $(this).text("cancel"); 
      }else if($(this).text()=='cancel'){ 
       wrapper.prepend("<p>" + changeBoxText +"</p>"); 
       $('.editBox').remove(); 
       $('.save').remove(); 
       $(this).text('Edit'); 
      } 

     }); 


     $('.save').click(function(event){ 
      var editBox = $(this).parent('div').find('.editBox'); 
      var editBoxText = editBox.text(); 

      var wrapper = $(this).parent('div'); 
      wrapper.prepand("<p>" + editBoxText + "</p>"); 
      editBox.remove(); 
      $(this).remove(); 
     }); 
    }); 
</script> 

Ma partie qui font du travail est

$('.save').click(function(event){ 
     var editBox = $(this).parent('div').find('.editBox'); 
     var editBoxText = editBox.text(); 

     var wrapper = $(this).parent('div'); 
     wrapper.prepand("<p>" + editBoxText + "</p>"); 
     editBox.remove(); 
     $(this).remove(); 
    }); 

où l'emballage prepand habitude la balise p et la zone d'édition et le .save ne sera pas en retirer . j'essaye d'ajouter l'alerte ("travail") dans ceci et il n'alertera pas du tout. Quelqu'un sait pourquoi?

Answer 1

C'est ce bit: .prepand(), devrait être: .prepend() :)

Actuellement, il jetterait un .prepand() est pas une erreur de fonction, quelque chose le long de ces lignes, pour une version complète plus courte, vous pouvez utiliser .prependTo() ainsi:

$('.save').live('click', function() { 
    var editBox = $(this).parent('div').find('.editBox').remove(); 
    $("<p />", { text: editBox.val() }).prependTo($(this).parent('div')); 
    $(this).remove(); 
}); 

au deuxième coup d'œil, je vois que vous ajoutez ces dynamiquement, dans ce cas, vous devez utiliser .live() comme je l'ai ci-dessus, le .click() avec un sélecteur ne trouvera pas ces éléments créés plus tard, donc il ne fonctionnera jamais :)