03
Май
2020

Как Правильно вызвать метод или функцию с помощью события onclick?

Есть обычная вот такая разметка. Текст в заголовке h1 должен заменяться по клику по нему. НО как можно заметить по открытию кода в браузере, заголовок меняется еще до клика по нему. Почему так? Но при этом если присвоить событию text.onclick функцию change() сразу, то всё работает.. И я никак не могу понять почему?
П.С если событие добавить прямо в атрибут к заголовку то опять же всё работает.
П.П.С глубоко извиняюсь за такое плохое оформление вопроса, мой первый уж.

<div>
    <!-- изменяемый заголовок  -->
    <h1 id="info">just a string</h1>
<script>
    var text = document.getElementById('info');
// функция для замены
function change() {
    text.innerHTML = 'the string was changed';
    return false;
};
text.onclick = change();
</script>
</div>

  <!-- Второй вариант при котором всё прекрасно работает  -->
<div>
    <!-- на этот раз заголовок с другим id чтобы ошибок не было -->
    <h1 id="info2">just a string</h1>
<script>
    var text = document.getElementById('info2');
// тут событие и функция связываются
text.onclick = function change() {
    text.innerHTML = 'the string was changed';
    return false;
};

</script>
</div>

Источник: https://ru.stackoverflow.com/questions/1119529/%D0%9A%D0%B0%D0%BA-%D0%9F%D1%80%D0%B0%D0%B2%D0%B8%D0%BB%D1%8C%D0%BD%D0%BE-%D0%B2%D1%8B%D0%B7%D0%B2%D0%B0%D1%82%D1%8C-%D0%BC%D0%B5%D1%82%D0%BE%D0%B4-%D0%B8%D0%BB%D0%B8-%D1%84%D1%83%D0%BD%D0%BA%D1%86%D0%B8%D1%8E-%D1%81-%D0%BF%D0%BE%D0%BC%D0%BE%D1%89%D1%8C%D1%8E-%D1%81%D0%BE%D0%B1%D1%8B%D1%82%D0%B8%D1%8F-onclick

Тебе может это понравится...

Добавить комментарий