验证单选按钮的 HTML 问题

时间:2021-07-01 11:44:42

标签: javascript html

我想对单选按钮进行条件验证,如下所示。

enter image description here

我希望在选择“是”时使查询 16 和 17 处于非活动状态。

我尝试过这种方法:

Validate set of fields only if radio button is checked (conditional validation)

http://jsfiddle.net/milz/tbw22L59/8/

这对我来说看起来很有希望。不幸的是,在应用到我的代码后,它不起作用。到目前为止,我在一个查询中尝试过

HTML:

                             <figure class="fig">
                                    <label>
                                        <div class="order">15</div>
                                        <p>Scheme managed block<span class="asterisk">&#42; </span></p>
                                    </label>
                                    <br>
                                    <input id="op_managed_block_yes" name="scheme_managed_block" class="radiobtn" type="radio" value="Yes" required>Yes
                                    <input id="op_managed_block_no" name="scheme_managed_block" class="radiobtn" type="radio" value="No">No 
                                    <br>
                                </figure>
                                <figure class="fig" id="op_manager_on_site">
                                    <label>
                                        <div class="order">16</div>
                                        <p>If Yes is Scheme Manager on-site<span class="asterisk">&#42;</span></p>
                                    </label>
                                    <br>
                                    <input name="if_yes_is_scheme_manager_on-site" class="radiobtn" type="radio">Yes
                                    <input name="if_yes_is_scheme_manager_on-site" class="radiobtn" type="radio">No 
                                    <br>
                                </figure>

JavaScript:

  <script>
                                         $("input[name=scheme_managed_block]").on('click', function() {
                                    var managerOnSite = $('#op_manager_on_site');
                                    // if is company
                                        if ($(this).val() == "Yes") {
                                            // show panel
                                            managerOnSite.show();

                                            // remove disabled prop
                                            managerOnSite.find('input,select,radio').prop('disabled', false);
                                        } else {
                                            // if is not company, hide the panel and add disabled prop
                                            managerOnSite.hide();
                                            managerOnSite.find('input,select,radio').prop('disabled', true);
                                        }
                                    });
                                </script>

脚本位于 HTML 代码的正下方。

那么错误在哪里?

0 个答案:

没有答案
相关问题