javascript - 为什么 chrome 在我的 JS 上抛出错误,但在 IE FF Android 和 Safari 中运行良好?
问题描述
我创建了一个带有条件 div 的排序形式。当用户单击是/否单选按钮时,将显示一个新的 div。在除 chrome 之外的所有浏览器中,它都可以正常工作。但是在 Chrome 中,当用户选择是/否单选按钮时,不会显示新的 div 并且控制台会抛出以下错误
未捕获的类型错误:无法在 HTMLInputElement.onchange 的 displayQuestion (conditional.js:3) 处读取 null 的属性“样式”
这是有问题的 HTML:
<label>
<input type="radio" id="yestub" name="walltile1" value="yes"
onchange="displayQuestion(this.value, 2)" />Yes
</label>
<label>
<input type="radio" id="notub" name="walltile1" value="no"
onchange="displayQuestion(this.value, 2)" />No
</label>
<div id="yesQuestion2" style="display:none;"><br/>
<!-- some form fields -->
</div>
<div id="noQuestion2" style="display:none;"><br/>
Ok Thank you!
</div>
这是相关的JS:
function displayQuestion(answer, n) {
document.getElementById(answer + 'Question' + n).style.display = "block";
if (answer == "yes") {
document.getElementById('noQuestion' + n).style.display = "none";
}
else if (answer == "no") {
document.getElementById('yesQuestion' + n).style.display = "none";
}
}
为什么这会将 null 返回到 chrome 但在其他浏览器中可以正常工作?
还做了一个小提琴,无法让它在那里工作.. https://jsfiddle.net/fiveonadub/mq7erj9f/3/
有人可以帮我理解这里发生了什么。
我也是stackoverflow的新手,所以如果我问错了这个问题,请告诉我如何做得更好。
谢谢
解决方案
这只是 CodePen 中加载顺序的问题。在 Javascript 窗口/面板中,单击下拉菜单并选择功能“No wrap - bottom of <body>
”并重新运行您的代码。
推荐阅读
- git - 更改不属于我自己的分支:Push 还是 PR?
- r - 使用gather创建聚集条形图时出错
- python - 如何解决“私人测试用例”PySchool
- python - 如何在python中使用beautifulsoup在python中循环url
- c# - 如何按照接收时间降序接收消息
- python - 从 Python 编写 VTK 文件以在 Paraview 中使用
- authentication - 检查用户是否在 .net Core 2.2 中通过 Windows 身份验证
- postgresql - postgres查询中的多个命名窗口
- python - 处理带有 spacy 的 Document 的子集
- r - 以闪亮的方式访问 server() 不同部分的数据