我有一个带有自定义复选框的表单，我想保留对其他html页面的引用。我希望用户选择其中一个复选框，然后单击底部的开始按钮。应该发生的是，它将把用户带到附加到复选框的html文件中。我知道这可能没有道理，因此请转到该网站的web版本以了解我要做什么。
<form method="post">
<div class="form-row">
<div class="col-sm-1">
</div>
<div class="col-sm">
<div class="media">
<img src="https://www.mometrix.com/academy/wp-content/uploads/2017/12/Algebra-I-1024x683.jpg" class="mr-3" alt="" width="150" height="150">
<div class="media-body">
<h5 class="mt-0">Algebra</h5>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch1" name="AL">
<label class="custom-control-label" for="customSwitch1"></label>
</div>
</div>
</div>
</div>
<div class="col-sm">
<div class="media">
<img src="https://www.wikihow.com/images/thumb/a/ae/Find-Area-and-Perimeter-Step-7-Version-2.jpg/aid3987529-v4-728px-Find-Area-and-Perimeter-Step-7-Version-2.jpg" class="mr-3" alt="..." width="150" height="150">
<div class="media-body">
<h5 class="mt-0">Area & Perimeter</h5>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch2" name="AP">
<label class="custom-control-label" for="customSwitch2"></label>
</div>
</div>
</div>
</div>
<div class="col-sm-12">
</div>
</div>
<div class="form-row">
<div class="col-sm-1">
</div>
<div class="col-sm">
<div class="media">
<img src="https://www.mathsisfun.com/numbers/images/arithmetic.svg" class="mr-3" alt="..." width="150" height="150">
<div class="media-body">
<h5 class="mt-0">Arithmetic</h5>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch3" name="AR">
<label class="custom-control-label" for="customSwitch3"></label>
</div>
</div>
</div>
</div>
<div class="col-sm">
<div class="media">
<img src="https://www.mathsisfun.com/algebra/images/exponent-8-2.svg" class="mr-3" alt="..." width="150" height="150">
<div class="media-body">
<h5 class="mt-0">Exponents</h5>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch4" name="EX">
<label class="custom-control-label" for="customSwitch4"></label>
</div>
</div>
</div>
</div>
<div class="col-sm-12">
</div>
</div>
<div class="form-row">
<div class="col-sm-1">
</div>
<div class="col-sm">
<div class="media">
<img src="https://dmzn2b8hkpq8b.cloudfront.net/images/products/515x515/S411589.jpg" class="mr-3" alt="..." width="150" height="150">
<div class="media-body">
<h5 class="mt-0">Geometric Solids</h5>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch5" name="GS">
<label class="custom-control-label" for="customSwitch5"></label>
</div>
</div>
</div>
</div>
<div class="col-sm">
<div class="media">
<img src="data:image/png;base64,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" class="mr-3" alt="..." width="150" height="150">
<div class="media-body">
<h5 class="mt-0">Probability</h5>
<div class="">
<input type="checkbox" class="custom-control-input" id="customSwitch6" name="PR">
<label class="custom-control-label" for="customSwitch6"></label>
</div>
</div>
</div>
</div>
<div class="col-sm-12">
</div>
</div>
<div class="form-row">
<div class="col-sm-1">
</div>
<div class="col-sm">
<div class="media">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcTDvygQLpB_G08iwALHg6N6rIEm1abgLnEQKZF0Qn6QOZFQDYWP" class="mr-3" alt="..." width="150" height="150">
<div class="media-body">
<h5 class="mt-0">Systems of Equations</h5>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch7" name="SE">
<label class="custom-control-label" for="customSwitch7"></label>
</div>
</div>
</div>
</div>
<div class="col-sm">
<div class="media">
<img src="http://home.windstream.net/okrebs/Ch8-28.gif" class="mr-3" alt="..." width="150" height="150">
<div class="media-body">
<h5 class="mt-0">Trig Statements</h5>
<div class="custom-control custom-switch">
<input type="checkbox" class="custom-control-input" id="customSwitch8" name="TR">
<label class="custom-control-label" for="customSwitch8"></label>
</div>
</div>
</div>
</div>
<div class="col-sm-12">
</div>
</div>
<center>
<button type="submit" class="btn btn-outline-success">Start</button>
</center>
</form>
答案 0 :(得分：0)
我做了一些小改动
1 _将每个页面的数据页添加到带有页面网址的复选框。
2 _在表单
document.addEventListener("DOMContentLoaded", function()
{
const
MyForm = document.getElementById('My-Form'),
all_checkBox = document.querySelectorAll('#My-Form input[type=checkbox]'),
SubmitBt = document.querySelector('#My-Form button[type=submit]');
all_checkBox.forEach(chkBx=>{ chkBx.onchange = ChkBxChanged })
SubmitBt.disabled = true;
function ChkBxChanged(e)
{
MyForm.action = '';
SubmitBt.disabled = true;
if ( this.checked )
{
MyForm.action = this.dataset.page;
SubmitBt.disabled = false;
all_checkBox.forEach(cb=>{
if (cb!=this) cb.checked = false // only one should be checked
})
}
}
})<form id="My-Form" action="" method="POST" >
<h5 class="mt-0">Algebra</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch1" name="AL" data-page="Algebra.html" >
<h5 class="mt-0">Area & Perimeter</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch2" name="AP" data-page="Area_Perimeter.html" >
<h5 class="mt-0">Arithmetic</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch3" name="AR" data-page="Arithmetic.html" >
<h5 class="mt-0">Exponents</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch4" name="EX" data-page="Exponents.html" >
<h5 class="mt-0">Geometric Solids</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch5" name="GS" data-page="Geometric_Solids.html" >
<h5 class="mt-0">Probability</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch6" name="PR" data-page="Probability.html" >
<h5 class="mt-0">Systems of Equations</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch7" name="SE" data-page="Equations.html" >
<h5 class="mt-0">Trig Statements</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch8" name="TR" data-page="Trig_Statements.html" >
<button type="submit" class="btn btn-outline-success">Start</button>
</form>
答案 1 :(得分：0)
这是我为您提供给Jojo先生的代码所做的
<script>
const
MyForm = document.getElementById('My-Form'),
all_checkBox = document.querySelectorAll('#My-Form input[type=checkbox]'),
SubmitBt = document.querySelector('#My-Form button[type=submit]');
all_checkBox.forEach(chkBx => { chkBx.onchange = ChkBxChanged })
SubmitBt.disabled = true;
function ChkBxChanged(e) {
MyForm.action = '';
SubmitBt.disabled = true;
if (this.checked) {
MyForm.action = this.dataset.page;
SubmitBt.disabled = false;
all_checkBox.forEach(cb => {
if (cb != this) cb.checked = false // only one should be checked
})
}
}
</script>
<form id="My-Form" action="" method="POST">
<h5 class="mt-0">Algebra</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch1" name="AL" data-page="index.html">
<h5 class="mt-0">Area & Perimeter</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch2" name="AP" data-page="index.html">
<h5 class="mt-0">Arithmetic</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch3" name="AR" data-page="index.html">
<h5 class="mt-0">Exponents</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch4" name="EX" data-page="index.html">
<h5 class="mt-0">Geometric Solids</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch5" name="GS" data-page="index.html">
<h5 class="mt-0">Probability</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch6" name="PR" data-page="index.html">
<h5 class="mt-0">Systems of Equations</h5>
<input type="checkbox" class="custom-control-input" id="customSwitch8" name="SE" data-page="index.html">
<button type="submit" class="btn btn-outline-success">Start</button>
</form>