如何解决(JS) 返回 null 作为函数的值
我有一个函数,它从 html 中获取两个 INPUT 的 id 并检查它是否被填充。如果已填写,则执行 if 脚本。
该函数开始执行脚本并工作,但它在控制台中返回一个错误(无法读取 null 的属性“值”)。 即使我做了几次更正也无法解决的错误。
function progressBarPasta() {
let verInq2 = document.getElementById("NumeroDaOcorrencia");
let verInq5 = document.getElementById("NumeroDoProcesso");
let progressBar0 = document.getElementById("barProgress0");
let progressBar25 = document.getElementById("barProgress25");
let progressBar50 = document.getElementById("barProgress50");
let progressBar75 = document.getElementById("barProgress75");
let progressBar100 = document.getElementById("barProgress100");
if (verInq2.value && verInq5.value) {
progressBar25.style.display = "block";
progressBar0.style.display = "none";
progressBar50.style.display = "none";
progressBar75.style.display = "none";
progressBar100.style.display = "none";
}
}
progressBarPasta();
<div class="form-group pmd-textfield col-sm-3">
<label for="NumeroDaOcorrencia" class="control-label cssPerguntas espacamentoLabels">
<strong>1.3</strong> Número da ocorrência
</label>
<input class="form-control" id="NumeroDaOcorrencia" maxlength="1000" placeholder="N° da ocorrência"
asp-for="InqueritoModel.NumeroDaOcorrencia"
type="text">
</div>
<div class="form-group pmd-textfield col-sm-4">
<label for="NumeroDoProcesso" class="control-label cssPerguntas espacamentoLabels">
<strong>1.13</strong> Número do processo
</label>
<input class="form-control" id="NumeroDoProcesso" placeholder="Nº do processo" maxlength="1000"
asp-for="ProcessoModel.NumeroDoProcesso"
type="text">
</div>
解决方法
您的脚本在呈现 html 之前执行。您应该将 defer
属性添加到您的脚本或将您的脚本放在 body
标签的底部
只需将您的 js 放在输入之后..
function progressBarPasta() {
let verInq2 = document.getElementById("NumeroDaOcorrencia");
let verInq5 = document.getElementById("NumeroDoProcesso");
let progressBar0 = document.getElementById("barProgress0");
let progressBar25 = document.getElementById("barProgress25");
let progressBar50 = document.getElementById("barProgress50");
let progressBar75 = document.getElementById("barProgress75");
let progressBar100 = document.getElementById("barProgress100");
if (verInq2.value && verInq5.value) {
progressBar25.style.display = "block";
progressBar0.style.display = "none";
progressBar50.style.display = "none";
progressBar75.style.display = "none";
progressBar100.style.display = "none";
}
}
progressBarPasta();
<div class="form-group pmd-textfield col-sm-3">
<label for="NumeroDaOcorrencia" class="control-label cssPerguntas espacamentoLabels">
<strong>1.3</strong> Número da ocorrência
</label>
<input class="form-control" id="NumeroDaOcorrencia" value="" maxlength="1000" placeholder="N° da ocorrência"
asp-for="InqueritoModel.NumeroDaOcorrencia"
type="text">
</div>
<div class="form-group pmd-textfield col-sm-4">
<label for="NumeroDoProcesso" class="control-label cssPerguntas espacamentoLabels">
<strong>1.13</strong> Número do processo
</label>
<input class="form-control" id="NumeroDoProcesso" value="" placeholder="Nº do processo" maxlength="1000"
asp-for="ProcessoModel.NumeroDoProcesso"
type="text">
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。