Entfernen geklonten Ereignisses JQuery

Question

Ich bin Ereignisse in einem Feld hinzufügen und während ich sie hinzufügen kann, bin ich mir nicht sicher, wie Sie die richtige Funktion schreiben, um sie zu entfernen. Ich hatte es in Javascript arbeiten, wurde aber gebeten, es mit JQuery zu schreiben und es scheint nicht zu funktionieren. Alle Beispiele, die ich untersucht habe, scheinen nicht mit meiner ursprünglichen Klonfunktion zu funktionieren, die einen Remove-Button enthält. Die Fieldsets duplizieren auch und ich habe den Code bereits dafür, nur ein wenig Hilfe mit dieser remove-Event-Funktion.

Hier ist es die Javascript/jquery:

var _eventCounter = 0; 
var removeEventButton = $("<input></input>").attr("type", "button").attr("value", "-"); 
function addEvent(num) 
{ 
    _eventCounter++; 
    var c = $("#event-code-"+num).clone(true); 
    c.attr("id", "event-code-"+num); 
    var eventName = "s"+num+"_e["+_eventCounter+"]"; 
    $('#'+ eventName, c).val('') 
    $("#textNumberRequired1", c).val(''); 
    removeEventButton.attr("onClick", "removeEvent('+c+')"); 
    $(c).append(removeEventButton.clone(true)); 
    $("#event-placeholder-"+num).append(c); 

} 

function removeEvent(c) { 
    //$("#event-placeholder #event-code-1").remove(); 
    $(c).remove(); 

} 

ist die html/php:

<div id="section_placeholder"> 
    <div id="section_template1"> 
     <fieldset class="box-outline-blue"> 
      <legend>Section Requirements</legend> 
      <h3>Number of events required: </h3><input type="text" id="textNumberRequired1" size="8" name="numberRequired1"><br> 
      <br /> 
      <h3>Please enter the required event codes: </h3> 
      <div id="event-placeholder-1"> 
       <div class="eventCode" id="event-code-1"> 
        <br />Event Code: <input type="text" id = "eventCodes_section1" name="s1_e[]" size=8 > <input type="button" id="add" onClick="addEvent(1)" value="+"> 
       </div> 
      </div> 
      <br /><br /> 

     </fieldset> 


    </div> 
</div> 

Answer 1

• Ändern Sie die Schaltfläche Entfernen Onclick auf jQuery:

  dies: removeEventButton.attr("onclick", "removeEvent("+c+")");

  zu: $(removeEventButton).on("click", removeEvent);

• ein class zu Ihrem event-placeholder-x div hinzufügen, wird es leichter sein

  <div id="event-placeholder-1" class='placeholder'>

• und schließlich zu löschen, wenn die remove button ein Ihre klicken empfängt removeEvent sollte es Eltern finden und entfernen es

  dies: $(c).remove();

  an: $(this).parentsUntil('.placeholder').remove();