有没有一种方法可以添加一条错误消息以显示在使用Javascript的网页上？

我试图在Javascript中添加错误消息处理，但遇到了问题。如果用户输入的状态长度不是两个字符，我将尝试让它输出错误消息。如果有帮助的话，我还包括我的renderBarChart函数

js

html

声明：
提交

我注意到几个问题

您已经在表单上设置了

novalidate

，这意味着

。setCustomValidity（）

错误不会显示，因为不会执行验证

如果在元素上设置了属性，则为interactive 约束的验证不会发生

--

如果

stateUserInput

是

#状态输入

输入，

.textContent

应该工作，并且应该设置文本。但是它可能不会显示为

无效反馈

类具有CSS属性

display:none。您需要添加
d-block
类或使用
无效反馈
元素，如引导示例所示

请注意，您更愿意在表单上添加事件侦听器并侦听事件，而不是单击提交按钮上的
事件。
什么样的故障或问题？不幸的是，错误消息从未显示<代码>renderBarChart没有定义
我确实定义了它！我只是把它包含在代码中，我知道它是有效的，因为一切都在运行。只是不是我的错误消息。现在-
数据集未定义
stateSubmitButton.addEventListener("click", function(event) {
    event.preventDefault();
    state = stateUserInput.value.toUpperCase();
    let stateFeedbackElem = document.querySelector("#stateFeedback");
    if (state.length == 2) {
        stateUserInput.setCustomValidity("");
        stateFeedbackElem.textContent = "";
        renderBarChart(state);
        state = "";
    } else {
        stateUserInput.setCustomValidity("Please enter a two letter abbreviated state.");
        stateFeedbackElem.textContent = "Please enter a two letter abbreviated state.";
        state = "";
    }
})

 <form class="form" novalidate>
    <label for="state-input">State:</label> 
    <input name="state" type="text" id="state-input" placeholder="(i.e. WA)">
    <button type="submit" id="state-submit" class="btn btn-dark btn-lg ml-2">Submit</button>
    <div id="stateFeedback" class="invalid-feedback"></div>
</form>