当我不使用div标记单选工具栏运行此代码时，到另一个页面的onlick函数(例如使用StackOverflow主页(可以工作。当我添加div标记单选工具栏来设计单选按钮时，onlick不起作用。
这是没有div标记单选工具栏的HTML和CSS。。。
<style>
#main_page {
background: #34357c;
padding: 10px 20px 30px 20px;
width: 900px;
height: 600px;
font-family: 'roboto', sans-serif;
position: fixed;
z-index: -1;
margin-top:315px;
margin-left: 415px;
}
</style><!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id= "main_page">
<input type = "radio" id = "ID1" value = "Husband" onclick = "window.location.href = 'https://www.stackoverflow.com'"><label>Husband</label>
<input type = "radio" id = "ID2" value = "Wife" onclick = "window.location.href = 'https://www.stackoverflow.com'"><label>wife</label>
</div>
</body>
</html>当我在div标记Radio工具栏中添加单选按钮样式时，到另一个html的onlick功能不起作用。。。
<style>
#main_page {
background: #34357c;
padding: 10px 20px 30px 20px;
width: 900px;
height: 600px;
font-family: 'roboto', sans-serif;
position: fixed;
z-index: -1;
margin-top:315px;
margin-left: 415px;
}
.radio-toolbar input[type="radio"] {
margin-top: 25px !important;
opacity: 0
}
.radio-toolbar label {
display: inline-block;
border-radius: 50px;
padding: 10px 20px;
font-size:25px;
border: 2px solid #444;
width: 110px;
height: 110px;
vertical-align: middle;
margin-bottom: 20px;
text-align: center;
background: #daeaff;
color: #4c4de4;
}
.radio-toolbar label:hover {
background-color: #white;
color: #DDDDDD;
}
</style><!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id= "main_page">
<div class = "radio-toolbar">
<input type = "radio" id = "ID1" value = "Husband" onclick = "window.location.href = 'https://www.stackoverflow.com'"><label>Husband</label>
<input type = "radio" id = "ID2" value = "Wife" onclick = "window.location.href = 'https://www.stackoverflow.com'"><label>wife</label>
</div>
</div>
</body>
</html>当使用代码片段时，您可以在第一个代码片段中看到，单击其中一个单选按钮会产生一个操作，而在第二个代码片段，单击单选按钮后不会发生任何事情。
感谢您的帮助！
编辑：感谢@DCR帮助问题更加清晰
您需要将onclick事件放置在标签上，因为您隐藏了单选按钮
<style>
#main_page {
background: #34357c;
padding: 10px 20px 30px 20px;
width: 900px;
height: 600px;
font-family: 'roboto', sans-serif;
position: fixed;
z-index: -1;
margin-top:315px;
margin-left: 415px;
}
.radio-toolbar input[type="radio"] {
margin-top: 25px !important;
opacity: 0
}
.radio-toolbar label {
display: inline-block;
border-radius: 50px;
padding: 10px 20px;
font-size:25px;
border: 2px solid #444;
width: 110px;
height: 110px;
vertical-align: middle;
margin-bottom: 20px;
text-align: center;
background: #daeaff;
color: #4c4de4;
}
.radio-toolbar label:hover {
background-color: #white;
color: #DDDDDD;
}
</style><!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id= "main_page">
<div class = "radio-toolbar">
<input type = "radio" id = "ID1" value = "Husband" ><label onClick = "window.location.href = 'https://www.stackoverflow.com'">Husband</label>
<input type = "radio" id = "ID2" value = "Wife" ><label onClick = "window.location.href = 'https://www.stackoverflow.com'">wife</label>
</div>
</div>
</body>
</html>我将您的hrefs更改为https://www.stackoverflow.com所以他们会在片段中工作。它在这里工作，我们有什么错误或问题你有
<style>
#main_page {
background: #34357c;
padding: 10px 20px 30px 20px;
width: 900px;
height: 600px;
font-family: 'roboto', sans-serif;
position: fixed;
z-index: -1;
margin-top:315px;
margin-left: 415px;
}
</style><!DOCTYPE html>
<html>
<head>
</head>
<body>
<div id= "main_page">
<input type = "radio" id = "ID1" value = "Husband" onclick = "window.location.href = 'https://www.stackoverflow.com'"><label>Husband</label>
<input type = "radio" id = "ID2" value = "Wife" onclick = "window.location.href = 'https://www.stackoverflow.com'"><label>wife</label>
</div>
</body>
</html>