如何使輸入RESET按鈕？
資訊：
嗨，我正在嘗試這樣做，如果我單擊具有 ID 的輸入，search-input這樣如果我在輸入中寫一些東西，那么類 cancel是重置值的交叉類<button type =" reset "> ，如果我寫一些東西讓它出現對我來說display: block;，如果我洗掉或輸入它就沒有價值可做display: none;，我想做這一切以使其作業，即使用戶沒有 Javascript 所以我想用 PHP 版本但是我不知道到目前為止我有什么我只有這個代碼在輸入中有東西時顯示圖示但不幸的是代碼已經停止作業，特別是當我通過按鈕洗掉輸入時圖示不會消失更多資訊請務必不要害怕詢問。
const input = document.getElementById("search-input")
const button = document.getElementById("cancel")
const icon = document.getElementById("icon")
input.addEventListener('keyup', test);
button.addEventListener("button", test)
function test() {
let isShown = false
if (input.value.trim() == "" || isShown == false) {
icon.style.display = "none"
isShown = true
} else {
icon.style.display = "flex"
}
}
PS：一切都是谷歌翻譯的，如果有錯誤或者你不明白寫的東西，我一定會提前告訴你應該怎么想，非常感謝你的幫助。
uj5u.com熱心網友回復：
我認為 Uttam Nath 的答案接近你想要的，但不完全是。這可能會更好：
編輯：好吧，我稍微更改了代碼，并添加了 HTML，所以沒有混淆。
<body>
<input type="text" id="search-input">
<button type="button" id="cancel">Cancel</button>
<div id="icon" style="background-color: green; width: 50px; height: 50px; display: none;"></div>
</body>
<script>
const input = document.getElementById("search-input");
const button = document.getElementById("cancel")
const icon = document.getElementById("icon");
input.addEventListener('keyup', changeIconDisplay);
button.addEventListener('click', () => {
input.value = '';
changeIconDisplay();
});
function changeIconDisplay() {
if (input.value.trim() == "" ) {
icon.style.display = "none";
} else {
icon.style.display = "flex";
}
}
</script>
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/485956.html
標籤：javascript php html css
上一篇：Firestore-我是否會為未完成讀取其資料而獲得的檔案收費？
下一篇：SVG線性漸變硬停止