2017-01-14 4 views
0

Kann mir jemand sagen, wie HTML-Code anhängen, die Button-Element haben und diese Schaltfläche funktionsfähig machen? Warum funktioniert meine Funktion nicht auf der angehängten Schaltfläche?jQuery-Funktion nach dem Anhängen Element

Hier ist mein Code:

<div id="attachments"> 
    <input id="add-attachment" type="button" value="Dodaj kolejny &#x271A;" class="button-custom-3"> 
    <div class="hr-custom-1"></div> 
<div> 
    <input type="button" value="Przeglądaj" class="button-custom-1"> 
    <span>Przykładowa nazwa załączonego pliku.jpg</span> 
    <input type="button" value="Usuń &#x2716;" class="button-custom-2 button-remove-attachment"> 
    <div class="hr-custom-1"></div> 
</div> 

<div> 
    <input type="button" value="Przeglądaj" class="button-custom-1"> 
    <span>Przykładowa nazwa załączonego pliku.jpg</span> 
    <input type="button" value="Usuń &#x2716;" class="button-custom-2 button-remove-attachment"> 
    <div class="hr-custom-1"></div> 
</div> 

JavaScript-Funktionen:

$(".button-remove-attachment").click(function(){ 
    $(this).parent().remove(); 
}); 

$("#add-attachment").click(function(){ 
    var element = $("<div><input type='button' value='Przeglądaj' class='button-custom-1'><span>Przykładowa nazwa załączonego pliku.jpg</span><input type='button' value='Usuń &#x2716;' class='button-custom-2 button-remove-attachment'><div class='hr-custom-1'></div></div>"); 
    $("#attachments").append(element);  
}); 

Bitte überprüfen Sie es auf jsFiddle: https://jsfiddle.net/6f9xhr64/

+1

bitte genauer erklären, was genau Sie tun möchten. –

+0

check jsFiddle bitte https://jsfiddle.net/6f9xhr64/ – Kamczatka

Antwort

0

Versuchen unter Code

$(document).on("click",".button-remove-attachment",function(){ 
    $(this).parent().remove(); 
}); 


$(document).on("click","#add-attachment",function(){ 
    var element = $("<div><input type='button' value='Przeglądaj' class='button-custom-1'><span>Przykładowa nazwa załączonego pliku.jpg</span><input type='button' value='Usuń &#x2716;' class='button-custom-2 button-remove-attachment'><div class='hr-custom-1'></div></div>"); 
    $("#attachments").append(element); 

}); 
+0

Verwenden Sie den oben genannten Code, alle Funktionen der Taste funktionieren gut. Ich habe auch jsfiddle für die gleichen erstellt. Überprüfen Sie diesen Link https://jsfiddle.net/btbboahh/1/ – GSB

0

Da Ihre Tasten dynamisch an einem gewissen Punkt hinzugefügt werden, in Zeit, müssen Sie On() -Methode Überladung mit drei Parametern verwenden Ters. Sie sollten auf dieses Thema beziehen: Dynamic Html elements

Verwandte Themen