在其他无线电设备中的特定答案之后灰显特定的无线电设置

时间:2017-02-23 16:13:09

标签: javascript jquery html

我有一个有两个问题的表格:

你想来什么日子? 你想什么时候来。
当您在问题1中回答“我无法参加”时,问题2应该显示为灰色。我找到了很多可能的解决方案,但没有找到可以帮助我的解决方案:(大多数都带有一个复选框,根据选中的选项,单选按钮被禁用或不通过。但是,这是我到目前为止所拥有的: / p>

<fieldset>
                    <div>
                        ~(IF(CHARINDEX('VISIT_DAY',DATA_ERROR)>=0,'<label style="color:#CC0000; font-weight:bold; width:100% !important; padding:0px !important; margin:0px !important; text-align:left !important;">','<label style="color:black; font-weight:bold; width:100% !important; padding:0px !important; margin:0px !important; text-align:left !important;">'))~ Ja, ik ben graag bij dit evenement aanwezig. Mijn voorkeursdag is:<span style="color:#CC0000;display:inline !important;">*</span> ~(IF(CHARINDEX('VISIT_DAY',DATA_ERROR)>=0,'</label>','</label>'))~

                        <div style="clear:both;">
                        </div>

                        <div style="float:left !important; clear:none !important;color:black;">
                            <input type="radio" value="A" style="width: auto !important;" ~(IF(@VISIT_DAY='A','checked',''))~ name="VISIT_DAY" /> 21 maart 2017<br />
                            <input type="radio" value="B" style="width: auto !important;" ~(IF(@VISIT_DAY='B','checked',''))~ name="VISIT_DAY" /> 22 maart 2017<br />
                            <input type="radio" value="C" style="width: auto !important;" ~(IF(@VISIT_DAY='C','checked',''))~ name="VISIT_DAY" /> Ik kan niet aanwezig zijn<br />
                        </div>
                    </div>

                    <div>
                        ~(IF(CHARINDEX('VISIT_TIME',DATA_ERROR)>=0,'<label style="color:#CC0000; font-weight:bold; width:100% !important; padding:0px !important; margin:0px !important; text-align:left !important;">','<label style="color:black; font-weight:bold; width:100% !important; padding:0px !important; margin:0px !important; text-align:left !important;">'))~ Ik zal komen binnen het volgende tijdsbestek:<span style="color:#CC0000;display:inline !important;">*</span> ~(IF(CHARINDEX('VISIT_TIME',DATA_ERROR)>=0,'</label>','</label>'))~

                        <div style="clear:both;">
                        </div>

                        <div style="float:left !important; clear:none !important;color:black;">
                            <input type="radio" value="A" style="width: auto !important;" ~(IF(@VISIT_TIME='A','checked',''))~ name="VISIT_TIME" /> 09.30 - 13.00<br />
                            <input type="radio" value="B" style="width: auto !important;" ~(IF(@VISIT_TIME='B','checked',''))~ name="VISIT_TIME" /> 13.00 - 16.30<br />
                            <input type="radio" value="C" style="width: auto !important;" ~(IF(@VISIT_TIME='C','checked',''))~ name="VISIT_TIME" /> 16.30 - 20.00
                        </div>
                    </div>
                    </fieldset>

因此,当问题1中选择了选项C时,问题二应该显示为灰色/禁用。非常感谢你!至今。

Eelco

1 个答案:

答案 0 :(得分:0)

您应该将更改事件监听器添加到收音机VISIT_DAY,如果所选值为C,则禁用VISIT_TIME,否则,将其激活。

$('body').on('change', 'input[name="VISIT_DAY"]', function(e) { 
    var $input = $(this)
      , value = $input.val()
      , $timeInput = $('input[name="VISIT_TIME"]')
      ;
    $timeInput.prop('disabled', value === "C");
} );