我正在尝试通过在portfolio gallery中单击分配的按钮来检查模式表单中的复选框(我不希望每次选中模式表单时都弹出,检查操作要在后台完成,但当单击用于弹出模式表单的特定按钮时会显示出来。例如“立即订购”按钮。) 我的modal和gallery的HTML代码如下:
模态部件
<div class="modal fade" id="exampleModalCenter" tabindex="-1" role="dialog" aria-labelledby="exampleModalCenterTitle" aria-hidden="true">
<div class="modal-dialog modal-dialog-centered" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title w-100 text-center" >Fill your Enquiry</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body justify-content-center">
<form action="mail_handler.php" method="POST" name="form" class="form-box">
<div class="modal-body mx-3">
<div class="form-group">
<div class="form-row">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="check1" name="tours[]" value="check1">
<label class="custom-control-label" for="check1">Check1</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="Check2" name="tours[]" value="check2">
<label class="custom-control-label" for="Check2">Check2</label>
</div>
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="Check3" name="tours[]" value="check3">
<label class="custom-control-label" for="Check3">Check3</label>
</div>
</div>
<div class="form-row">
<div class="custom-control custom-checkbox">
<input type="checkbox" class="custom-control-input" id="Check4" name="tours[]" value="Check4">
<label class="custom-control-label" for="Check4">Check4</label>
</div>
作品集库部分:
<div class="section-title" data-aos="zoom-out-right">
<h2>Gallery</h2>
<p>galler details</p>
</div>
<div class="row portfolio-container" data-aos="zoom-out-right" data-aos-delay="400">
<div class="col-lg-4 col-md-6 portfolio-item">
<div class="portfolio-wrap">
<img src="">
<div class="portfolio-info">
<h4>Pcture 1</h4>
<p>Picture 1 details </p>
<div class="portfolio-links">
<button id="checkmodal" type="button" class="buttonaa" class="check"><a><i class="bx bx-plus"></i></a></button>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item">
<div class="portfolio-wrap">
<img src="">
<div class="portfolio-info">
<h4>Picture 2</h4>
<p>Picture 2 details</p>
<div class="portfolio-links">
<button id="checkmodal" type="button" class="buttonaa" class="check"><a><i class="bx bx-plus"></i></a></button>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item">
<div class="portfolio-wrap">
<img src="">
<div class="portfolio-info">
<h4>Picture 3</h4>
<p>Picture 3 details</p>
<div class="portfolio-links">
<button id="checkmodal" type="button" class="buttonaa" class="check"><a><i class="bx bx-plus"></i></a></button>
</div>
</div>
</div>
</div>
<div class="col-lg-4 col-md-6 portfolio-item">
<div class="portfolio-wrap">
<img src="">
<div class="portfolio-info">
<h4>Picture 4</h4>
<p>Picture 4 details.</p>
<div class="portfolio-links">
<button id="checkmodal" type="button" class="buttonaa" class="check"><a><i class="bx bx-plus"></i></a></button>
</div>
</div>
</div>
</div>
注意,我没有添加两个部分的结尾,只需要一个javascript来执行这些,但是,在谷歌搜索了几天之后,我没有找到它。 我不是一个web开发人员,现在只是学习。
我假设你的意思是你想在页面上有一个按钮“在后台”选中一个模式内的复选框,而不激活该模式
null
function checkIt(x) {
var checkbox = document.getElementById(x)
if(!checkbox.checked) {
checkbox.checked = true
} else {
checkbox.checked = false
}
}
<input type="checkbox" id="myCheck">
<button onclick="checkIt('myCheck')">Change State</button>