Помогите мне улучшить мой мастер форм

Всем привет, Поэтому я думаю, что это лучшее место, чтобы опубликовать это. Итак, вот оно. Я пытаюсь превратить форму в мастера, адаптированного для мобильных устройств, и думаю, что у меня все работает... но я не уверен, правильно ли он закодирован.
Здесь (код codepen.io)

это то, что у меня есть до сих пор.

И это работает.

С точки зрения функциональности, когда пользователь переходит к вопросу 8, чтобы отправить форму.

нажатие кнопки отправки загружает временную пустую страницу перед переходом к s1proc.php; что и должно быть.

Но почему он загружает эту пустую страницу? И есть ли способ ускорить процесс подачи?

Второе это я видел этот урок

о том, как отобразить больше полей при выборе переключателя. Как я могу перенести это сюда так, чтобы кнопка «Далее» не отображалась, пока пользователь не выберет ответ? Большое спасибо

Ну, код - это беспорядок.



Кроме того, вы также повторяете много кода, который должен быть там только один раз — например, кнопки «Следующий/Предыдущий». Что вам нужно сделать, так это загрузить всю форму и скрыть все, кроме первого вопроса, с помощью javascript, а затем разместить кнопку «Следующий/предыдущий» под элементами переключения, которая затем загружает следующий/предыдущий элемент.



Затем на последней странице/элементе вы переключаете кнопку «Далее» с помощью кнопки отправки — вы можете стилизовать отправку и кнопки одинаково, поэтому я не совсем понимаю необходимость использования кнопки.

Используйте отправку, чтобы форма работала, даже если JavaScript отключен. Код тоже нуждается в небольшом исправлении.

Посмотрим, смогу ли я его немного переписать.

На самом деле, метод :target не работает в IE, так как они придурки справляются с обработкой :valid, поскольку "onchange" не срабатывает до тех пор, пока элемент не потеряет фокус.

так что это не идеальное решение.

Сделать #days первым просто означает добавить его в URL.

Я собираюсь на обед, но когда вернусь, я попытаюсь обновить версию переключателя, чтобы скрыть «Далее» и/или «Отправить» — но опять же, это не работает в IE, поэтому может потребоваться некоторое помощь в написании сценариев для отображения/скрытия кнопок.

Мне придется с этим поиграть.

Тогда как на самом деле у меня были бы такие.

типа.

Чего я бы не стал делать? JavaScript.

Гораздо меньше жирного идиота-полуумника TRAIN WRECK о том, как НЕ писать JavaScipt, известный как jQuery.



В современных браузерах я бы использовал/злоупотреблял переключателями для выбора каждого вопроса, пустыми метками с атрибутами FOR вместо кнопок для предыдущего/следующего, подключал предыдущий/следующий текст, используя сгенерированный контент, и использовал CSS 3 для анимации и выбора с помощью Элемент: проверено.

Для браузеров с поддержкой Pre CSS3 я бы просто показывал все вопросы сразу, О, НУ, они не видят предыдущую/следующую и глупую анимированную чушь.

Вот, попробуйте это:

http://www.cutcodedown.com/for_others/asgsoft/template.html

Как и во всех моих примерах, каталог:
http://www.cutcodedown.com/for_others/asgsoft/

...широко открыт для легкого доступа. JavaScript? Нам не нужен JavaScript? JS бесплатно и ваши скрипты бесплатно... это не работает, вы так не делаете. Скажу вам, эти ребята тупые. В браузерах до CSS3 кнопки «Предыдущий/Следующий» невидимы, поскольку они не получают стиль и не заполняются, поэтому для них внизу отображается только сообщение об отправке.

В современных браузерах вы получаете причудливую анимацию постепенного появления/затухания, кнопки «Предыдущий/Следующий» и т. д. и т. п.

По сути, он имеет «постепенную деградацию» — форму можно использовать во всех версиях, от IE 5.5 до современных новейших версий, даже если старые браузеры не поддерживают все навороты.

Вы также можете попробовать использовать привязки и :target, но это может привести к нежелательному поведению прокрутки.

Преимущество этого подхода заключается в меньшем количестве разметки (вы можете исключить внешние переключатели) и отсутствии «странных переключателей», показывающих, когда CSS отключен/недоступен/неприменим.

Это потрясающе! Огромное вам спасибо за это. Однако есть один небольшой вопрос. В «целевой» версии, как я мог сделать так, чтобы на начальном экране отображалось «количество дней», а не ссылка на запуск.