我有这个简单的HTML代码,它显示隐藏的元素在情况下,用户选择‘是’。 我在这段代码中遇到的问题是:在用户提交并按下浏览器上的back按钮之后,它仍然显示“Yes”,但没有显示隐藏的元素。 用户必须单击“否”,然后重新选择“是”,以便再次显示数据。 对此如何解决? 我加了这张照片供你参考
<!DOCTYPE html>
<html>
<head>
<title>Some Title</title>
<script type='text/javascript'>
function onload() {
document.getElementById('YesOrNo').onchange = function (e) {
if (this.value == 'Yes') {
document.getElementById('Details').style.display='';
} else {
document.getElementById('Details').style.display='none';
}
};
}
</script>
</head>
<body onload='onload()'>
<h2 >Welcome to ABC</h2>
<form action=. method='POST' enctype='multipart/form-data'>
YesOrNo?
<select id='YesOrNo' name = 'Insert' style='width: 80px;height: 25px' required>
<option value='No'>No</option>
<option value='Yes'>Yes</option>
</select>
<div id='Details' style='display:none;'>
<br><b>Some Hidden Data</b><br>
</div>
<br><br><input type='submit' name='my-form' value='Submit' style='width: 100px;height: 40px;font-weight: 700'><br>
</form>
<hr>
See you soon
</body>
</html>
我看了一下你的代码,但我觉得有问题。 您已经创建了一个基于onchange事件的函数,这非常好。 但是如果页面返回,则不会调用该事件,这意味着不会调用该函数。 因此,未设置display属性,这意味着内容保持隐藏。