Ereignis-Listener beim Anhängen an innerHTML beibehalten
Beim Zuweisen zum innerHTML eines übergeordneten Knotens können an Nachkommen angehängte Ereignishandler zerstört werden. Betrachten Sie zum Beispiel den Code unten:
<div><div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false"><span>
<script></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">mydiv = document.getElementById("mydiv");
mydiv.innerHTML += "bar";</pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<p></script> ;<br></pre></p>
<p>Hier das Onclick-Event Der an den Span angehängte Handler, der „foo“ enthält, wird nach der Zuweisung zu mydiv.innerHTML zerstört.</p>
<p>Um dieses Problem zu vermeiden, verwenden Sie die Methode .insertAdjacentHTML() anstelle von .innerHTML. Diese Methode behält Ereignis-Listener bei und wird von allen gängigen Browsern unterstützt.</p>
<p><pre class="brush:php;toolbar:false"><script></p>
<div class="code" style="position:relative; padding:0px; margin:0px;"><pre class="brush:php;toolbar:false">var html_to_insert = "<p>New paragraph</p>";
document.getElementById('mydiv').insertAdjacentHTML('beforeend', html_to_insert);</pre><div class="contentsignin">Nach dem Login kopieren</div></div>
<p></script>
Das Argument „beforeend“ gibt an, wo im Element der HTML-Inhalt eingefügt werden soll. Weitere Optionen sind „beforebegin“, „afterbegin“ und „afterend“.
Das obige ist der detaillierte Inhalt vonWie kann ich den Verlust des Ereignis-Listeners verhindern, wenn ich innerHTML ändere?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
So stellen Sie den Textbereich schreibgeschützt ein
Wörter verschwinden nach dem Tippen
Wie tippe ich die Inschrift auf dem Münzkreis ein?
So erstellen Sie einen WeChat-Klon
Einführung in Screenshot-Tastenkombinationen in Win8
So behalten Sie zwei Dezimalstellen in C++ bei
Nutzung der Bodenfunktion
jsonp löst domänenübergreifende Probleme
![[Web-Frontend] Node.js-Schnellstart](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
