复选框只能在用户单击超链接(条款和条件?



我正在尝试编写一个表单,用户可以在其中选择一个选项,并且某些表单会因该选项而显示 - 我与jquery配合得很好。接下来,我试图让用户必须单击条款和条件的超链接,然后才能选中复选框。

我已经看到了多个用户必须单击复选框才能看到超链接的示例,但我想知道它是否可以反过来。

<div id="additionalForm" class="FormDiv">
<fieldset>
<legend>Housing Agreement</legend>
<input id="chkSignature" name="chkSignature" type="checkbox" required>
<label for="chkSignature">
<b>I have read and I agree to the 
	  <a href="TermsandConditions.asp" target="_blank">Terms and Conditions</a>
</b>
</label>
</fieldset>
</div>

现在,我已经验证了复选框,但我无法查看它们是否真的在读取超链接中的内容。我想让用户先单击我的 HTML 中的超链接,然后才能选中该框。

  • 在复选框上添加了disabled属性
  • 在单击链接时添加了单击事件侦听器
  • 单击链接时删除了禁用的属性

document.querySelector('#termsAndConditions')
.addEventListener('click', function(e){
document.querySelector('#chkSignature').removeAttribute('disabled');
});
<div id="additionalForm" class="FormDiv">
<fieldset>
<legend>Housing Agreement</legend>
<input id="chkSignature" name="chkSignature" type="checkbox" required disabled>
<label><b>I have read and I agree to the <a href="TermsandConditions.asp" target="_blank" id="termsAndConditions">Terms and Conditions</a></b></label>
</fieldset>
</div>

最新更新