я должен преобразовать H1 в кнопку, чтобы позволить ему вызвать функцию? - PullRequest
1 голос
/ 25 июня 2019

Я создал динамическую веб-страницу, которая в основном является формой поиска.Вызывается несколько функций в зависимости от того, какая кнопка нажата, и, наконец, веб-страница заканчивается несколькими заполненными текстовыми полями.

Я хочу добавить функцию empty(), чтобы позволить мне очистить все текстовые поля и перейтивернуться к исходной ситуации (когда веб-страница открыта, прежде чем нажать на любую кнопку и вызвать любую функцию).Я хочу вызывать такую ​​функцию всякий раз, когда пользователь нажимает на заголовок страницы, который для простоты является элементом <h1>.

Интересно, должен ли я заменить элемент <h1> наи затем вызовите функцию empty() для события .click(), как показано ниже:

function main() {        

    $("#idOfTheButton").on('click', functionEmpty);      

};

... или, если я могу оставить элемент <h1> и добавить к нему такую ​​функциюпосле присвоения идентификатора?

... Или, в качестве альтернативы, я должен преобразовать <h1> в <img> и добавить <href> или функцию empty() каким-либо образом?

Как лучше всего вызывать функцию, нажимая на заголовок веб-страницы?

        • РЕДАКТИРОВАТЬ - - - -

Я сохранил элемент <h1>, присвоил ему идентификатор TitleH1 и добавил следующую функцию к main():

function main() {

    $('#TitleH1').on('click', window.location.reload() );

};

Проблема теперь в том, что страница постоянно перезагружается, не нажимая <h1> ...

        • РЕДАКТИРОВАТЬ 2 - - - - -

Я превратил метод window.location.reload в функцию (спасибо @MHD за предложение), и теперь он работает.Правильный фрагмент кода:

function main() {    

    $('#TitleH1').on('click', ()=> window.location.reload());

    }

1 Ответ

2 голосов
/ 25 июня 2019

Заголовок не является кнопкой, кнопка не является заголовком. Ваш визуальный дизайн звучит странно для меня, это заставляет меня думать, что ваш пользовательский опыт может страдать.

Если вы используете A -элемент, то вы создаете ссылку с атрибутом href. Его цель - навигация. Так что ваша первоначальная мысль сделать его button имеет смысл. Не злоупотребляйте A -элементом, если хотите, чтобы он был кнопкой; просто используйте кнопку.

То, что я бы предложил: оставьте ваш H1 элемент как есть. Добавьте кнопку сброса к вашей форме, пометьте ее как «сброс». Затем onClick вы можете запустить функцию сброса, хотя кнопка <input type="reset" /> автоматически сделает это за вас, если вы находитесь внутри form.

...