Изменить выбранную вкладку на основе выбранной радиокнопки и опции с помощью jQuery - PullRequest
Новая
       24

Изменить выбранную вкладку на основе выбранной радиокнопки и опции с помощью jQuery

0 голосов
/ 06 июня 2018

Я хочу добиться следующего:

Если в списке выбора выбрана страна, отличная от Германии (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

1 Ответ

0 голосов
/ 06 июня 2018

Возможно, вы имеете в виду это?

В любом случае, легче читать и изменять 

$("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();
...