Vincular um clique para um botão dinâmico com jQuery?

votos
1

Eu quero criar um botão que tem um jQuery clique na mosca. Depois que o usuário é feito e aperte o botão eu quero destruir o botão eo jQuery clique até um tempo que eu precisar dele recriado.

Não estou certo de como fazer isso em jQuery. Eu sei que jQuery.liveé uma opção, mas não tenho certeza se isso seria melhor ou pior do que a maneira que eu quero fazê-lo.

Publicado 27/08/2009 em 04:33
fonte usuário
Em outras línguas...                            


3 respostas

votos
2

Vive iria funcionar muito bem. Se você gostaria de evitar o uso ao vivo, você pode conectar-se o novo botão que você adicioná-la à DOM.

function addNewButton() {
  $("sweet_selector_here").append("<input type='button' id='sweetness' value='press me, i am awesome' />");
  $("#sweetness").click(function() {
    $(this).remove();
  });
}

Com vivo torna-se o seguinte:

function addNewButton() {
  $("sweet_selector_here").append("<input type='button' id='sweetness' value='press me, i am awesome' />");
}

$("#sweetness").live("click", function() {
  $(this).remove();
});
Respondeu 27/08/2009 em 04:45
fonte usuário

votos
0

Sinto muito para deixar a tal velha pergunta e respondeu. Eu tive um problema semelhante e esta resposta me ajudou, mas não me ficar muito lá. Depois de tentativa e erro ... Aqui está a minha solução prática para adicionar áreas a página da web e removê-los. Eu usá-lo com campos de formulários dinâmicos, mas suas necessidades podem variar.

Aqui está parte do formulário na parte estática da página.

<fieldset>
  <legend>Email-tauluun</legend>
    <a class="button_ajax email-add">Add new area</a>
    <p>
      <span class="email_original_area">
        <label>Email:
          <input type="text" name="emails[]" id="email0" />
        </label>
      </span>

      <!--Below we add some more areas-->
      <span id="email_add_area"></span>
    </p>
</fieldset>

Então precisamos de algumas funções de JavaScript. Estes queridos usar jQuery.

<script type="text/javascript">

//we need a counter for dynamic fields
var cnt=0;

$(document).ready(function(){
  $('.email-add').click(function(){

  cnt += 1; //let's count...

  $('#email_add_area').append(
    '<span class="dynExtra"><br /><label>Email: ' +
    '<input type="text" name="emails[]" id="email' + cnt + '" /></label>' +
    '</span>'
  );

    //this function creates a button for newly created area
    //must be done after the creation of the area
    addRemover();
  });
});

function addRemover() {
  //appends remove button to the last created area
  $('<a class="button_ajax dynExtra-clear" name="dynExtra-clear">Remove area ' + cnt + '</a>').appendTo('#email_add_area');

  //remove the clicked button and it's previous sibling
  $('.dynExtra-clear').click(function(){
  $(this).prev().remove();
  $(this).remove();
  });
}

</script>

Espero que isso ajude alguém e eu não esquecer de nada.

Respondeu 22/02/2012 em 19:44
fonte usuário

votos
0

Isso deve funcionar. Alterar html em cordas de forma adequada:

   $('#targetdiv').append( $("<div>foobar</div>").click( function(evt) { $(this).remove(); }))

Aqui está um site demo mostrando-lo em ação.

Respondeu 27/08/2009 em 04:41
fonte usuário

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more