Dieser Artikel stellt hauptsächlich die JS-Implementierung des Hinzufügens von Ereignisoperationen zu dynamisch erstellten Elementen vor, einschließlich des dynamischen Hinzufügens von Javascript-Seitenelementen und der Fähigkeit zur Ereignisantwort. Freunde in Not können sich darauf beziehen
Die Beispiele in Dieser Artikel beschreibt die Implementierung von JS-Ereignisoperationen für dynamisch erstellte Elemente. Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:
Wir alle wissen, wie man Ereignisse zu direkt in HTML generierten Elementen hinzufügt, aber wie fügt man Ereignisse zu einem dynamisch generierten Element hinzu? in jquery kann Um dies zu erreichenlive
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>www.jb51.net - JS实现为动态创建的元素添加事件</title>
<script src="js/lib/jquery-1.7.2.min.js"></script>
</head>
<body>
<button id="btn">添加事件</button>
<p id="panel"></p>
<script>
// js原生实现
// var btn=document.getElementById("btn");
// btn.onclick=function(){
// var arr= [];
// for(var i=0;i<10;i++){
// arr.push("<p id='nep'>"+i+"</p>");
// }
//
// document.getElementById("panel").innerHTML=arr.join('<br/>');
// }
//
//jquery部分实现
$("#btn").click(function(){
var arr= [];
for(var i=0;i<10;i++){
arr.push("<p id='nep'>"+i+"</p>");
}
$("#panel").html(function(){
return arr.join("<br/>");
});
});
//为动态创建的html标签元素添加事件
$("#nep").live("click",function(){
var that=$(this);//获取当前点击的this对象
console.log(that.text());
});
</script>
</body>
</html>
Einführung in die Aufrufsequenz von Funktionen in Vue
Detaillierte Erläuterung dynamischer Komponenten und Rendering basierend auf Vue2. 0
Vue implementiert Methoden zum dynamischen Erstellen und Löschen von Daten
Das obige ist der detaillierte Inhalt vonJS-Implementierungsbeispiel für das Hinzufügen von Ereignisoperationen zu dynamisch erstellten Elementen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
