使用JavaScript基于电子邮件值和布尔yes/no字段隐藏字段

Question

我的门户上有一个Microsoft门户页面，需要通过JavaScript进行一些定制。我想隐藏基于电子邮件地址输入的字段，这是很好的工作。但是，当用户进入将显示某些字段的电子邮件域时，我想应用其他格式设置。

下面是我目前的代码：

$(document).ready(function () {
     $("#emailaddress1").change(onShowHideEmployeeFields);
     onShowHideEmployeeFields();
});

function onShowHideEmployeeFields() {
    var varEmail = $("#emailaddress1").val()
    //alert(varEmail)
    if (varEmail.includes("@example.org")) {
       $('#xxx_employeeid').parent().parent().show();
       $('#xxx_employeeid').prop('required', true);
       $('#xxx_employeeid').closest(".control").prev().addClass("required");
       $('#xxx_defaultfacilityid').parent().parent().show();
       $('#xxx_defaultfacilityid').prop('required', true);
       $('#xxx_defaultfacilityid').closest(".control").prev().addClass("required");
       $('#xxx_positiontitle').parent().parent().show();
       $('#xxx_officer').parent().parent().show();
       $('#xxx_officer').prop('required', true); 
       $('#xxx_officer').closest(".control").prev().addClass("required");
       $('#xxx_jopositiontitle').parent().parent().show();
    }
    else {
        $('#xxx_employeeid').parent().parent().hide();
        $('#xxx_defaultfacilityid').parent().parent().hide();
        $('xxx_defaultfacilityid_label').parent().parent().hide();
        $('xxx_positiontitle_label').parent().parent().hide();
        $('#xxx_positiontitle').parent().parent().hide();
        $('#xxx_officer').parent().parent().hide();
        $('#xxx_jopositiontitle').parent().parent().hide();
    }
}

但是，如果军官字段被标记为'Yes‘(这是一个布尔的是/否无线电复选框字段)，我希望通过显示JO职位标题来扩展代码。

我尝试使用以下代码分别测试这个组件：

function onShowHideEmployeeFields() {
$('xxx_officer').change(function () {
    var varJO = $("$xxx_officer").val();
    //alert(varJO)
    if (varJO === 'Yes') {
    $('xxx_jopositiontitle').parent().parent().show();
    }
    else {
    $('xxx_jopositiontitle').parent().parent().hide();
    }
})
}

这段代码似乎什么也不做。对这个问题有什么想法吗？

谢谢!

Answer 1

AFAICT您的问题归结为我如何检查是否选中了复选框？您尝试的代码在正确的轨道上，但这不是您如何获得复选框的状态。快速搜索可以找到许多例子：

$('xxx_officer').change(function () {
    var varJO = $("$xxx_officer").prop('checked');

    if (varJO) {
        $('xxx_jopositiontitle').parent().parent().show();
    } else {
        $('xxx_jopositiontitle').parent().parent().hide();
    }
});

这里有很多这样的例子，我投票把这个问题作为一个重复来结束。

• How do I check whether a checkbox is checked in jQuery?
• Get checkbox value in jQuery
• get current state of check box jquery
• Check if checkbox is checked with jQuery
• Get checkbox selected state with JQuery
• ...