Gunnar Bittersmann: onclick auf dynamisch hinzugefügte ID

Beitrag lesen

@@Pit

geht so ein Kontrukt grundsätzlich nicht oder ist einfach ein Fehler drin?

    $('#myDel').on('click', function(){
        $('#myVan' + ' .myButton').html("<span id='TDel'>Wirklich löschen?<span>");
    });


    $('#TDel').on('click', function(){
		console.log(this.id);
        $("#formDel").submit();
    });

Es geht grundsätzlich nicht.

$('#myVan .myButton')[1] ist das jQuery-Objekt zu einem button-Element, nehme ich an? Dann wird im Firefox der Eventhandler des inneren spans nie ausgeführt, sondern die Aktion, die auf dem button-Element liegt. ☞ Codepen
Das ist auch bei jQuery so. ☞ Codepen
Safari und Chrome führen beide Aktionen aus: die des spans und die des buttons.

Ansonsten ist es grundsätzlich falsch, Eventhandler für nicht-interaktive Elemente (span, div, …) zu registrieren. (Event delegation mal außenvorgelassen.) Ein großer Teil der Nutzer kann das mit Tastatur überhaupt nicht bedienen.

Merke: Niemals nicht-interaktive Elemente als Target für click-Events vorsehen! click-Events ausschließlich für interaktive Elemente wie a, button, input u.ä.

LLAP 🖖

--
“When UX doesn’t consider all users, shouldn’t it be known as ‘Some User Experience’ or... SUX? #a11y” —Billy Gregory

  1. Warum verkettest du da zwei Stringkonstanten anstatt gleich eine Stringkonstante hinzuschreiben? ↩︎