我想在单击某些内容后在 HTML 中创建 div 部分,但它只发生一次,如果我再次单击,它不会执行任何操作。可能是非常基础的事情,但我只是初学者。
document.getElementById("plusvideo").onclick = function gkHaj() {
var fdsf = 2;
var text = document.getElementById("leftsidesd").innerHTML;
var i = 1;
if (fdsf == 2) {
document.getElementById("leftsidesd").innerHTML = document.getElementById("leftsidesd").innerHTML + '<div class="episesnig">Episode 1 <input type="text" class="linkkepiz" placeholder="Link"></div>';
} else {}
}
<div id="leftsidesd">
<div class="episernig">Series 01</div>
<div id="plusvideo">+video</div>
<div class="episesnig">Episode 1 <input type="text" class="linkkepiz" placeholder="Link"></div>
</div>
嗯,这段代码中有些东西可能没用,但正如我所说,我点击 plusvideo,它起作用了,然后我再次点击它就不再起作用了,我应该放在那里或做什么。请在这里帮助这个可怜的初学者:'(
最佳答案
因为
document.getElementById("leftsidesd").innerHTML = document.getElementById("leftsidesd").innerHTML + '<div class="episesnig">Episode 1 <input type="text" class="linkkepiz" placeholder="Link"></div>';
附加到 plusvideo
的事件监听器由于 HTML 被修改并且旧元素被删除,因此不再存在。所以它只能工作一次。
var fdsf = 2;
document.getElementById("plusvideo").onclick = function gkHaj() {
var mydiv = document.createElement('div');
mydiv.setAttribute('class', 'episesnig');
mydiv.innerHTML = 'Episode ' + fdsf + '<input type="text" class="linkkepiz" placeholder="Link">';
fdsf++;
document.getElementById("leftsidesd").appendChild(mydiv);
}
<div id="leftsidesd">
<div class="episernig">Series 01</div>
<div id="plusvideo">+video</div>
<div class="episesnig">Episode 1 <input type="text" class="linkkepiz" placeholder="Link"></div>
</div>
关于javascript - 如何重复函数来放置另一个innerHTML?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43694211/