Jump to content
Ricardo Pereira

Jquery evento em novo elemento DOM

Recommended Posts

Ricardo Pereira

$(document).ready(function(){
 $("#items_list a").click(function(){
   $("#items_list_trade").append($(this));
 })
 $("#items_list_trade a").click(function(){
   $("#items_list").append($(this));
 })
})

Inicio a pagina com varios elementos <a> na div #items_list, e quando clico ele muda para a div #items_list_trade.

E depois eu queria que ao clicar na div #items_list_trade fizesse o percurso inverso, mas os elementos que foram mudados não reagem ao evento, e gostaria de saber como solucionar..

Share this post


Link to post
Share on other sites
Ricardo Pereira

Vou mostrar um exemplo.

<div id="items_list">
 <a></a>
 ...
 ...
</div>
<div id="items_list_trade">
</div>

Depos ao clicar na tag <a>, o elemento passaria para a div #items_list_trade e quando eu clica-se no elemento que foi movido, que ele volta-se á sua div de origem, mas isso não se sucede. Só um elemento <a> que já se encontre presente na div #items_list_trade é que executa o evento.:

$("#items_list_trade a").click(function(){
 $("#items_list").append($(this));
})

Share this post


Link to post
Share on other sites
Rui Carlos

Penso que precisas de usar o on( ) para elementos adicionados dinamicamente.

Qualquer coisa deste género:

$(document).on( 'click', '#items_list_trade a', function () {
  $("#items_list").append($(this));
});

$(document).on( 'click', '#items_list a', function () {
  $("#items_list_trade").append($(this));
});

  • Vote 2

Share this post


Link to post
Share on other sites
Ricardo Pereira

Resultou, obrigado.

Mas se não for pedir muito podias me explicar o porquê dessa solução?

Share this post


Link to post
Share on other sites
Rui Carlos

Pelo que percebi, o elemento que fica com o evento tem que existir quando registas o evento. No entanto, o elemento #items_list_trade a é adicionado dinamicamente, e como tal não vai ficar com o evento associado.

Já no código que indiquei, o on fica associado ao $(document), que já existe à partida. Em vez do $(document), penso que até era melhor usar um outro elemento mais interno, como uma div que inclua essas duas divs que mostraste, e que exista logo à partida.

Penso que uma outra alternativa passaria por registar o evento dentro da função que adiciona o elemento, i.e., logo depois de chamares o append. Pouco percebo de jQuery, pelo que não te sei dizer qual a solução mais aconselhável.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

×
×
  • Create New...

Important Information

By using this site you accept our Terms of Use and Privacy Policy. We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.