Question

我想实现以下目标：

如果从选择列表中选择德国（德）以外的国家/地区，则打印＆＃34;选项卡目前被选中，＆＃34;数字＆＃34;应选择选项卡，页面应向上滚动，并显示警告框。

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

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

因此，每次从选择列表中选择时，选项卡都会更改为＆＃34; digital＆＃34;并且页面向上滚动，但它应该只是选定的＆＃34;打印＆＃34;标签

这是我的完整代码：

// 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

更新了＆＃34;解决方案＆＃34;：

// 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();

使用jQuery

1 个答案: