javascript - 选中复选框后,我需要启用表单(它在页面加载时被禁用)

标签 javascript jquery forms checkbox

我在这里需要你的帮助,因为我不知道 javascript 或 jquery 库,我想我肯定必须在我的项目中使用它们。我在页面加载时禁用了表单,我想在检查时启用复选框。我尝试了很多但我没有找到任何解决方案..

这是页面加载时的“禁用”代码:

$(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;
}

关于javascript - 选中复选框后,我需要启用表单(它在页面加载时被禁用),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37607189/

相关文章:

javascript - 使用 Jquery 提醒过滤词

javascript - 抓取 php 中的 &lt;textarea&gt; 值(HTML 形式)

javascript - GraphQL 大整数错误 : Int cannot represent non 32-bit signed integer value

javascript - 检查表单是否至少有一个已填充/选中/选定的元素

javascript - 使用 Javascript 搜索表格

javascript - 我如何将这些查询结果放入表中

css - Twitter bootstrap : add margin, 位置图片和表单字段之间的空格

javascript - 条件 javascript 输入字段验证

javascript - C++ 信号回调(如 javascript)

javascript - react : Cleanest way of accessing component without using "this"