[英]I need to enable form (it is disabled on page load) after checkbox checked
我在这里需要您的帮助,因为我不了解javascript或jquery库,我认为我绝对必须在我的project中使用它们。页面加载时我有一个禁用的表单,我想在选中复选框时启用。我尝试了很多,但是没有找到任何解决方案。
页面加载时,以下是“禁用”代码:
$(document).ready(function (e) {
$("#form1 *").prop("disabled", "disabled");
});
复选框是:
<input type="checkbox" id="checkbox" name="opt[]" value="'.$points.'">
如果您有任何想法请通知我!
一枪但..没有结果是:
document.getElementById('checkbox').onchange = function() {
document.getElementById('eksargirwsh').disabled = this.checked;
};
表格代码:
<form method="post" id="eksargirwsh" action="update_points_test2.php">
<div class="col-lg-4">
<div class="ibox float-e-margins">
<div class="ibox-title">
<h5>Form1</h5>
</div>
<div class="ibox-content">
echo '
<div>
<div class="feed-activity-list"><div style="border: 0.5px solid green; border-right-style:none;" class="input-group m-b"><span class="input-group-addon">
<input type="checkbox" id="checkbox" name="opt[]" value="'.$points.'"></span>
<input type="hidden" name="opt2[]" value="'.$row_select4['id'].'">
<div class="feed-element">
<a href="profile.html" class="pull-left">
<img alt="image" class="img-circle" src="'. $row_select4['image_url']. '">
</a>
<div class="media-body ">
<div class="ibox-tools">
<span class="label label-primary">ΔΙΑΘΕΣΙΜΟ</span><br><br>
<span class="label label-warning-light pull-right"><strong>' .$row_select4['points']. '</strong> Πόντοι</span>
</div>
<strong>' .$row_select4['title']. ' </strong> ' .$row_select4['description']. ' <br>
<small class="text-muted">Διάρκεια: <strong>' .$row_select4['start_date']. ' - ' .$row_select4['end_date']. ' </strong></small>
<div class="well">
' .$row_select4['description']. '
</div>
</div>
</div>
</div>
</div>' ;
<button type="submit" id="submit" class="btn btn-w-m btn-primary">SUBMIT</button>
</form>
用这个。 您可以选择不是#checkbox
元素,然后首先将其禁用。 然后,将功能添加到checkbox
更改,如果选中则启用。
$(document).ready(function (e) {
$("#form1 *:not(#checkbox)").prop("disabled", true);
$("#form1").addClass('disabled');
$('#checkbox').change(function(){
$("#form1 *:not(#checkbox)").prop("disabled", !this.checked);
$("#form1").toggleClass('disabled', !this.checked);
})
});
#form1{
opacity: 1;
}
#form1.disabled{
opacity: 0.2;
}
如果是,则复选框的格式相同
您必须禁用整个页面,除了
$(document).ready(function() {
$('form :not([type=checkbox])').prop('disabled',true);
});
将此功能放在复选框中
$(":checkbox").click(function(){
if (this.checked) {
$('#form :not([type=checkbox])').prop('disabled',false);
}
else{
$('#form :not([type=checkbox])').prop('disabled',true);
}
}) ;
对于用户要求,在下面创建了小提琴,是链接
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.