Как предотвратить загрузку страницы при прокрутке
есть кнопка, которая при нажатии прокручивает страницу вниз
<form action = "#demo-section">
<button id = "demo" >demo</button>
Он связан с этим div, как показано ниже:
<div id = "demo-section" >
но когда я нажимаю на страницу, она обновляется, а затем идет вниз, а также? в адресной строке: http: //xxxx.xx/? # demo-section
Ответы 2
Если атрибут «type» не упоминается, все кнопки внутри элемента формы действуют как type = «submit». Так что просто добавьте к кнопке type = "button", и она заработает.
Обновлено: (как предлагает Майк 'Pomax' Камерманс в своем комментарии) вам лучше использовать тег привязки и стилизовать его как кнопку, если это то, чего ваша форма стремится достичь ..
установка типа, как вы упомянули, приводит к тому, что эта кнопка не работает. Я хочу использовать <тег и div, чтобы сделать кнопку прокрутки
Конечно. Также необходимо переместить «действие» из формы в событие «onclick» и т. д. Рад, что вы выбрали способ привязки - это то, что вы собираетесь делать в любом случае (-:
Хорошо, использовать якорь проще :)
Как уже упоминалось, вы должны добавить к кнопке атрибут type со значением "button", поэтому изменив
<button id = "demo" >demo</button>
к
<button id = "demo" type = "button">demo</button>
должен работать как задумано.
Кроме того, вы также можете выяснить, нужно ли использовать тег привязки (<a>) и установить для атрибута href значение #demo-section вместо использования form. Это будет иметь тот же эффект, но без элемента, который должен быть кнопкой (и без необходимости иметь форму упаковки - формы не предназначены для навигации, как упоминалось в комментарии Майка 'Pomax' Камерманса, и, следовательно, наиболее правильный подход будет наверное, этот).
Пример указанного метода:
<a href = "#demo-section">demo</a>
Это будет отображаться как гиперссылка с текстом «демонстрация», но ее можно изменить на любую другую вещь, включая другие элементы HTML, что будет более гибким, чем использование формы и кнопки (вы также можете стилизовать тег привязки с помощью CSS, чтобы он может даже кнопку быть, если желательно).
Если вы не пишете настоящую форму с вариантами, которые пользователь должен сделать, или полями, которые пользователь должен заполнить, не используйте для этого
form. Вместо этого используйте<a href = "#demo-section">и стиль как кнопку, потому что это то, что это: навигационная ссылка.