Legați un clic pentru un buton dinamic cu jQuery?

voturi
1

Vreau să creați un buton care are un clic jQuery pe zbor. După ce utilizatorul se face și apăsați pe butonul Vreau să distrugă butonul și faceți clic pe jQuery până la un timp am nevoie de ea recreat.

Nu sunt sigur cum să facă acest lucru în jQuery. Știu că jQuery.liveeste o opțiune , dar eu nu sunt sigur dacă acest lucru ar fi mai bine sau mai rău , atunci modul în care vreau să o fac.

Întrebat 27/08/2009 la 04:33
sursa de către utilizator
În alte limbi...                            


3 răspunsuri

voturi
2

Trăiește ar lucra bine. Dacă doriți să evitați utilizarea în direct, puteți sârmă în sus butonul nou pe măsură ce adauga la DOM.

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

Cu viu devine astfel:

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

$("#sweetness").live("click", function() {
  $(this).remove();
});
Publicat 27/08/2009 la 04:45
sursa de către utilizator

voturi
0

Îmi pare rău pentru a posta la o astfel de întrebare veche și răspuns. Am avut o problemă similară și acest răspuns m-au ajutat, dar nu mi-a lua destul de acolo. După încercare și eroare ... Iată soluția mea practică pentru adăugarea de zone la pagina web și eliminarea lor. L folosesc cu câmpuri de formular dinamice, dar nevoile dvs. pot varia.

Iată o parte din forma în porțiunea statică a paginii.

<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>

Apoi, avem nevoie de unele funcții JavaScript. Acestea folosesc 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>

Să sperăm că acest lucru ajută pe cineva și nu am uitat nimic.

Publicat 22/02/2012 la 19:44
sursa de către utilizator

voturi
0

Acest lucru ar trebui să funcționeze. Schimbarea html în șiruri în mod corespunzător:

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

Iată un site demonstrativ care arată - l în acțiune.

Publicat 27/08/2009 la 04:41
sursa de către utilizator

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