我正在嘗試在 javascript 中添加刪除按鈕，該按鈕會在單擊時自行刪除，但我不知道如何操作。這是我的代碼：<script>function displayPost(){var thisDiv = document.getElementById("posts");var theDate = document.createElement("P");theDate.classList.add("post-date");var trash= document.createElement("BUTTON");trash.classList.add("post-trash");trash.innerHTML = '<i class="fa fa-window-close" aria-hidden="true"></i>';thisDiv.appendChild(theDate);thisDiv.appendChild(trash);theDate.innerHTML = new Date();trash.onclick = del(this);}function del(x){var delTrash = document.getElementsByClassName("post-trash");var delDate = document.getElementsByClassName("post-date");var index = deltrash.indexof(x);thisdiv.removeChild(hideTrash[index]);thisdiv.removeChild(delDate[index]);}</script>抱歉，我對 Javascript 還很陌生。任何形式的幫助表示贊賞。謝謝
2 回答
拉丁的傳說
TA貢獻1789條經驗 獲得超8個贊
的值onclick應該是一個函數，您在進行賦值時調用該函數。
trash.onclick = function() { del(this) };另外，thisDiv是本地的displayPost()，你不能在 中使用它del()。你需要使用x.parentElement.
您在 中還有很多其他拼寫錯誤和小錯誤del()，請參閱下面的更正。
function displayPost() {
var thisDiv = document.getElementById("posts");
var theDate = document.createElement("P");
theDate.classList.add("post-date");
var trash = document.createElement("BUTTON");
trash.classList.add("post-trash");
trash.innerHTML = '<i class="fa fa-window-close" aria-hidden="true"></i>';
thisDiv.appendChild(theDate);
thisDiv.appendChild(trash);
theDate.innerHTML = new Date();
trash.onclick = function() {del(this);};
}
function del(x){
var delTrash = document.getElementsByClassName("post-trash");
var delDate = document.getElementsByClassName("post-date");
var thisDiv = x.parentElement;
var index = Array.from(delTrash).indexOf(x);
thisDiv.removeChild(delTrash[index]);
thisDiv.removeChild(delDate[index]);
}
<div id="posts">
</div>
<button onclick="displayPost()">Add post</button>
繁星coding
TA貢獻1797條經驗 獲得超4個贊
如果我答對了你的問題，這可能會對你有幫助。
<div class="container">
<!-- some posts with delete button -->
<div class="post">
Post One
<button class="delete-post">Delete Post</button>
</div>
<div class="post">
Post Two
<button class="delete-post">Delete Post</button>
</div>
<div class="post">
Post Three
<button class="delete-post">Delete Post</button>
</div>
</div>
<script>
window.onload = () => {
let postsDelBtn = document.getElementsByClassName("delete-post");
console.log(postsDelBtn)
for(let i = 0; i < postsDelBtn.length; i++){
postsDelBtn[i].addEventListener('click', (event) => {
event.target.parentNode.remove();
})
}
}
</script>
- 2 回答
- 0 關注
- 267 瀏覽
添加回答
舉報
0/150
提交
取消