Обработка button

Question

Только начал изучение JS, поэтому, вероятнее всего, допустил какую-то глупую ошибку. Замысел такой: пользователь вводит кличку, породу и вес собаки. Жмет на кнопку, вызывается функция, которая считывает инфу с полей, создает объект, передавая ему, считанные значения и вызывает метод объекта, который в свою очередь производит небольшую проверку по весу и выводит соответствующее сообщение. Но работает это иначе: в самом начале загрузки HTML выводится сообщение ": Тят!" и дальше кнопка не работает. Не могу понять почему, второй час вожусь.

window.onload = init;
function init(){
 var button = document.getElementById("addButton");
 button.onclick = handleButtonClick();
}
function handleButtonClick(){
 var textInput = document.getElementById("dogName");
 var dogName = textInput.value;
 var textInput = document.getElementById("dogBreed");
 var dogBreed = textInput.value;
 var textInput = document.getElementById("dogWeight");
 var dogWeight = textInput.value;
 var dog1 = new Dog(dogName, dogBreed, dogWeight);
 dog1.bark();
}
function Dog(name, breed, weight){
 this.name = name;
 this.breed = breed;
 this.weight = weight;
 this.bark = function(){
  if (this.weight > 25){
   alert(this.name + ": Вуф!!!");
  } else {
   alert(this.name + ": Тяв!");
  }
 };
}

<form>
  <input type="text" id="dogName" size="40" placeholder="Кличка собаки"><br>
  <input type="text" id="dogBreed" size="40" placeholder="Порода собаки"><br>
  <input type="text" id="dogWeight" size="40" placeholder="Вес собаки"><br>
  <input type="button" id="addButton" value="Голос!">
</form>

для того, чтоб участники форума могли понять что происхоит, загрузите код на jsfiddle. чтоб можно было сразу запустить. stackoverflow предоставляет такую возможность — Vladyslav Tereshyn, Jan 06 '18 at 17:21
у вас в самом начале js дока написано : window.onload = init; что вы хотите этим сделать? — Vladyslav Tereshyn, Jan 06 '18 at 17:23
@Vlad Teryoshin Ну в книге написано, что нужно так написать, чтобы функция с обработкой нажатия кнопки работала только после полной загрузки DOM. — Kafka, Jan 06 '18 at 17:25
дело в том, что она и вызывается сразу после загрузки страницы.. — Vladyslav Tereshyn, Jan 06 '18 at 17:28
сделайте пожалуйста, так, как я говорил с jsfiddle. просто скопируйте туда код и удалите скриншоты отсюда, никто просто не будет руками переписывать код себе — Vladyslav Tereshyn, Jan 06 '18 at 17:29
@VladTeryoshin jsfiddle и аналоги не следует использовать на stackoverflow, здесь есть встроенные инструменты для создания запускаемых сниппетов (сейчас он в вопросе уже добавлен) — andreymal, Jan 06 '18 at 17:55
@andreymal вы не совсем разобрались в вопросе, вопрос был написан со скриншотами. я попросил подключить jsfiddle...он встроен — Vladyslav Tereshyn, Jan 06 '18 at 18:13
@VladTeryoshin jsfiddle — это сторонний веб-сайт, который никогда не был и скорее всего никогда не будет встроен в stackoverflow. Хотя бы потому, что в stackoverflow уже давно встроены сниппеты, зачем сюда ещё jsfiddle пихать? — andreymal, Jan 06 '18 at 18:13
@andreymal, слушай, ты искал повода прикопаться? сниппет похож на фиддл, я так написал, ты если хочешь поумничать, пойди поотвечай на вопросы, а не устраивай тут черт знает что — Vladyslav Tereshyn, Jan 06 '18 at 18:17
@VladTeryoshin сниппет и «фиддл» это разные вещи. Прекращайте вводить людей в заблуждение. jsfiddle запрещён на stackoverflow: сайт выдаёт ошибку, если в вопросе добавить ссылку на jsfiddle. — andreymal, Jan 06 '18 at 18:18

score 2 · Accepted Answer · answered Jan 06 '18 at 17:33

2

А если написать так:

button.onclick = handleButtonClick;

answered Jan 06 '18 at 17:33

Алексей Шиманский

73,186

Спасибо! говорю же, вероятнее всего глупейшая ошибка))) – Kafka Jan 06 '18 at 17:49
@Kafka угу. можно нажимать галку рядом с ответом. он наверняка верный. и всегда...всегда, когда есть проблемы с кодом - вставляйте его в вопрос текстом, а не скриншотами. особенно для js,html,css на ruSO есть встроенный сниппет который исполняет код – Алексей Шиманский Jan 06 '18 at 17:57
бубликат же, мог бы и поискать :) – Grundy Jan 09 '18 at 20:42
@Grundy офигенное название "Как куда-нибудь передать функцию". Хотя если б мне было 12 - наверное я действительно по такому названию искал бы дубль – Алексей Шиманский Jan 09 '18 at 21:09

Обработка button

1 Answers1