如果隐藏元素的字符长度小于8，则显示隐藏元素

Question

我有一个名为ShowUsername的隐藏元素，如果用户输入的用户名少于8个字符，我想显示它。如果有人能帮我，我似乎想不通。我目前隐藏了这个元素，如果字符串输入是8个或更多个字符，它就会保持隐藏状态。

var myPassword = document.getElementById("Password");
var myUserName = document.getElementById("Username");
document.getElementById("frmRegister").onsubmit = function() {
<!-- Username must be 8 or more characters -->
if (myUserName.value.length >= 8) {
alert("YOur Username was saved");
} else {
ShowUsername.display;
}
}

Answer 1

请这样尝试。

ShowUsername.style.display = 'block';

Answer 2

使用style="display:none;"设置html中的默认显示，并使用style.display = 'block'或style = 'display:block;'显示

示例

window.btn.onclick = function() {
if (window.Username.value.length >= 8) {
window.ShowUsername.style = 'display:none;';
console.log("YOur Username was saved");
} else {
window.ShowUsername.style = 'display:block;';
}
}

<input id="Username">
<div id="ShowUsername" style="display:none;">👆 min 8 chars</div>
<div><button id="btn" type="button">BTN</button></div>