warum arbeitet Onclick nicht mit innerhtml

Hier versuche ich, html auf ein Element innerhtmlwarum arbeitet Onclick nicht mit innerhtml

<body> 
<h3>Dynamically Retrieve the chapter name</h3> 
<div> 
<div> 
    <button id="addChapter">Add Chapter</button> 
    <div id="courseStructure"> 

    </div> 
</div> 
</div> 
<script src="index.js"></script> 
</body>

JS mit hinzuzufügen:

var addChapter = document.getElementById("addChapter"); 

    addChapter.onclick = function(){ 
document.getElementById("courseStructure").innerHtml += '<div><input type="text" name="chaptername" placeholder="chapter name"/><button id="addSubChapter">Add SubChapter</button><button id="addContent">Add Content</button><br><br></div>'; 
}

alles scheint gut das Onclick-Ereignis feuern, wenn Schaltfläche geklickt wird aber der HTML-Code wird nicht zum Element hinzugefügt.

Quelle

2017-06-08 Kiran

Sein 'innerHTML' nicht' innerHtml' – Satpal

@Satpal danke. Du hast mich gerade gerettet. – Kiran

Sie haben innerHTML- in der richtigen Format nicht geschrieben. seine innerHTML- statt innerhtml Ihr Code sollte sein ..

<body> 
<h3>Dynamically Retrieve the chapter name</h3> 
<div> 
<div> 
<button id="addChapter">Add Chapter</button> 
<div id="courseStructure"> 

</div> 
</div> 
</div> 
<script src="index.js"></script> 
</body>

Ihre .JS Datei sein wird.

var addChapter = document.getElementById("addChapter"); 

addChapter.onclick = function() 
{ 
document.getElementById("courseStructure").innerHTML += '<div><input type="text" name="chaptername" placeholder="chapter name"/> 
<button id="addSubChapter">Add SubChapter</button> 
<button id="addContent">Add Content</button> 
<br><br></div>'; 
}

Quelle

2017-06-08 05:51:43

Ändern Sie innerHtml zu innerHTML.

var addChapter = document.getElementById("addChapter"); 
 

 
    addChapter.onclick = function(){ 
 
document.getElementById("courseStructure").innerHTML += '<div><input type="text" name="chaptername" placeholder="chapter name"/><button id="addSubChapter">Add SubChapter</button><button id="addContent">Add Content</button><br><br></div>'; 
 
}

<h3>Dynamically Retrieve the chapter name</h3> 
 
<div> 
 
<div> 
 
    <button id="addChapter">Add Chapter</button> 
 
    <div id="courseStructure"> 
 

 
    </div> 
 
</div> 
 
</div>

Quelle

2017-06-08 05:39:32

können Sie auf js Auswahl:

$("#courseStructure").click(function(){ 
document.getElementById("courseStructure").innerHtml += '<div><input type="text" name="chaptername" placeholder="chapter name"/><button id="addSubChapter">Add SubChapter</button><button id="addContent">Add Content</button><br><br></div>'; 
});

oder:

<button id="addChapter" onclick="myFunction()">Add Chapter</button>

Quelle

2017-06-08 05:42:33

warum arbeitet Onclick nicht mit innerhtml

Antwort

Verwandte Themen