javascript - 表单上单选按钮选择时的 Javascript VISIBLE 和 REQUIRED 字段

Question

我正在尝试编写一个函数，该函数将根据单选按钮的选择显示一个字段，并使该字段成为必需的。但是，如果没有做出上述选择，则该字段是隐藏的并且不需要。我有切换视图工作 - 这意味着它显示是否选择了第一个单选按钮，但我无法让它成为必需的。The field SSN is only visible if the choice 1 of field SocialSecurity is chosen.

这是表单上的单选按钮：

你有社会安全号码吗？

• （选择 1）作为美国公民、永久居民或临时工作居民，我有一个社会安全号码。

• （选择 2）由于我的国际学生身份、居留身份或特定签证类型，我没有社会安全号码。

请看我的代码：

$('.field.SocialSecurity input[type=radio]').on("change", function()
{
  switch($(this).val())
  {
    case 'As a U.S. Citizen, permanent resident, or temporary working resident, I have a Social Security Number.':
                $('.field.SSN').show();
                $('.field.SSN').attr('required', '');
                $('.field.SSN').attr('data-error', 'Please enter your Social Security Number.');
      break;

    case 'Due to my international student status, my residency status, or my specific visa type, I do not have a Social Security Number.':
        $('.field.SSN').hide();
        $('.field.SSN').removeAttr('required');
        $('.field.SSN').removeAttr('data-error');

      break;
  }     
});

标签： javascriptforms

Answer 1

像这样？

 $('.field.SocialSecurity input[type=radio]').on("change", function()
{
  switch($(this).val())
  {
    case 'As a U.S. Citizen, permanent resident, or temporary working resident, I have a Social Security Number.':
                $('.field.SSN').show();
                $('.field.SSN').prop('required', true);
                $('.field.SSN').prop('data-error', 'Please enter your Social Security Number.');
      break;

    case 'Due to my international student status, my residency status, or my specific visa type, I do not have a Social Security Number.':
        $('.field.SSN').hide();
        $('.field.SSN').prop('required', false);

      break;
  }     
});