it-swarm.com.de

<span> jQuery .click () funktioniert nicht

Also habe ich einen "Löschen" -Button in einem Bereich erstellt, aber aus irgendeinem Grund kann ich nicht das .click () auslösen. Irgendwelche Ideen? Ich bin neu bei jQuery und denke, dass es etwas offensichtliches ist. Ich habe ohne Erfolg in Chrome und Safari getestet. 

CSS:

.delete_button {
    cursor:pointer;
    color: #fff;
    border: 1px solid #FFF;
    border-radius: 15px;
    background: #AAA;
    font-size: 8px;
    line-height: 0px;
    padding: 0px 2px 0px 2px;
}

HTML/PHP:

<span class="delete_button" id="delete_<? echo $some_id; ?>">X</span>

jQuery: 

$(document).ready(function() {
    $('.delete_button').click(function() {
            var transaction_id = $(this).attr('id').replace('delete_','');
            alert("Delete transaction #" + transaction_id);
            return false;
        });
});
26

verwenden Sie .on ()

Da Ihr Bereich dynamisch hinzugefügt wird, ist er zum Zeitpunkt, zu dem DOM bereit oder das Laden der Seite ist, nicht vorhanden.

Sie müssen also Event Delegation verwenden

Syntax

$( elements ).on( events, selector, data, handler );

so was

$(document).on('click','.delete_button',function(){
    // code here
});

oder

$('parentElementPresesntAtDOMready').on('click','.delete_button',function(){
   // code here
});

ihr Code wird

$(document).ready(function () {
    $(document).on('click', '.delete_button', function () {
        var transaction_id = $(this).attr('id').replace('delete_', '');
        alert("Delete transaction #" + transaction_id);
        return false;
    });
});  
76
Tushar Gupta

Es scheint, als würde die Spanne dynamisch erstellt. Sie müssen die Ereignisdelegation verwenden. Binden Sie es an das nächstgelegene statische Elternteil oder Dokument

$(document).on('click','.delete_button',function(){
   /*Your code*/
});
11
Anton

Für das alte Webkit gibt es eine einfachere Lösung: Setzen Sie den Cursor über CSS für die Spanne auf den Zeiger.

0
Igor Nardo