gpt4 book ai didi

javascript - 选中时如何启用复选框?

转载 作者:行者123 更新时间:2023-11-28 15:06:58 24 4
gpt4 key购买 nike

这是我的代码:

HTML:

<input type="checkbox" id="checkme"/>
<p class="label-text"><b>By checking this, you agree to our <a href="terms.html" onclick="window.open(this.href, 'mywin',
'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" style="color: red;">Terms &amp; <br>Conditions</a>&nbsp;and&nbsp;<a href="privacy.html" onclick="window.open(this.href, 'mywin',
'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" style="color: red;">Privacy Policy</a></b></p>
<input class="formBtn" type="submit" id="submit" value="Submit" disabled="disabled" />

JavaScript

var checker = document.getElementById('checkme');
var sendbtn = document.getElementById('submit');
checker.onchange = function(){
if(this.checked){
sendbtn.disabled = false;
} else {
sendbtn.disabled = true;
};

jQuery

$( "#checkme" ).on( "click", function() {
if($( "#checkme:checked" ).length > 0) {
$('#submit').prop('disabled', false);
} else{
$('#submit').prop('disabled', true);
}
});

全部无效。请帮忙。

还帮我在 javascript 中添加一个 css 类,使按钮在禁用时透明。非常感谢!

最佳答案

您需要使用 change 而不是 click 并将样式添加到 disabled 输入您可以简单地使用 #submit[disabled ]

$( "#checkme" ).on( "change", function() {
$('#submit').prop('disabled', !this.checked);
}).change(); // use this to run change event on load
#submit{
transition-duration : 0.5s;
}
#submit[disabled]{
opacity : 0.5;
transition-duration : 0.5s;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" id="checkme"/>
<p class="label-text"><b>By checking this, you agree to our <a href="terms.html" onclick="window.open(this.href, 'mywin',
'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" style="color: red;">Terms &amp; <br>Conditions</a>&nbsp;and&nbsp;<a href="privacy.html" onclick="window.open(this.href, 'mywin',
'left=20,top=20,width=500,height=500,toolbar=1,resizable=0'); return false;" style="color: red;">Privacy Policy</a></b></p>
<input class="formBtn" type="submit" id="submit" value="Submit"/>

为了简化您的代码,您可以使用 $('#submit').prop('disabled', !this.checked); this.checked 将返回 true选中时为 false,未选中时为 false,因此您可以在它之前使用 ! 来反转它

Note: be sure you include jquery

要在禁用 true/false 时向输入添加效果,您可以添加类似 transition-duration : 0.5s;

的内容

关于javascript - 选中时如何启用复选框?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49203872/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com