使用 jQuery 根据选定的单选按钮和选项更改选定的选项卡

Question

我想实现以下目标：

如果从选择列表中选择了除德国 (de) 以外的国家，并且当前选择了“打印”选项卡，则应选择“数字”选项卡，页面应向上滚动并显示警告框.

到目前为止，我的代码可以工作，但是第二个 if 循环的第二个条件没有被评估：

if (this.value! = 'de' && $("input [value = 'print']"). prop ("checked", true)) {
    ..
}

因此，每次您从选择列表中进行选择时，选项卡都会更改为“数字”并且页面会向上滚动，尽管它应该只适用于选定的“打印”选项卡。

这是我的完整代码：

// if a country other than germany is elected, set selected tab to digital and scroll to top
$("select[name='country']").change(function(e){
    $("select[name='country'] option").each(function() {
        if (this.selected) {
            if (this.value != 'de' && $("input[value='print']").prop("checked", true) ) {
                $("input[value='digital']").prop("checked", true);
                $("form .alert").css({display: 'block'});
                var target = $('#top');
                 $('html, body').animate({
                   scrollTop:$(target).offset().top
                 },'slow');
                 e.preventDefault();    
            }                           
        }
    });
});

这里是带有描述的选项卡和选择列表的页面：

https://www.academyofsports.de/de/anmeldung/fernstudium.html?product=fitness-c-lizenz

---

更新“解决方案”：

// if a country other than germany is elected, set selected tab to digital and scroll to top
$("select[name='country']").on("change", function(e) {
    var isDE = this.value == 'de';
    if (!$("input[value='print']").is(":checked")) 
        return;
        $("form .alert").toggle(!isDE);
    if (isDE) 
        return;
    $("input[value='digital']").prop("checked", true);
    $("input[value='print']").prop( "disabled", true );
    $("select[name='country']").on('change', function() {
        if(isDE){
            $("input[value='print']").prop( "disabled", true );
        }
        else{
            $("input[value='print']").prop( "disabled", false );
        }
    });
    var target = $('#top');
    $('html, body').animate({
      scrollTop: $(target).offset().top
    }, 'slow');
});

这种方式现在可以使用，但是如果该过程重复，禁用功能将不再起作用。为什么？

该功能现已上线，可在此处进行测试：

https://www.academyofsports.de/de/anmeldung/fernstudium.html?product=fitness-c-lizenz

Answer 1

也许你是这个意思？

无论如何都更容易阅读和修改

$("select[name='country']").on("change", function(e) {
  var isDE = this.value == 'de';
  $("form .alert").toggle(!isDE);
  if (isDE) return;
  if (!$("input[value='print']").is(":checked")) return;
  e.preventDefault(); // Why?
  $("input[value='digital']").prop("checked", true);
  var target = $('#top');
  $('html, body').animate({
    scrollTop: $(target).offset().top
  }, 'slow');
});

另一种选择是

$('#top')[0].scrollIntoView();