Кнопка настройки.onclick с помощью нажатия кнопки активируется при первом нажатии кнопки

#javascript #html #button

Вопрос:

Поэтому я пытаюсь создать кнопку, которая при нажатии изменяет содержимое html-страницы и обновляет кнопку, чтобы изменить ее следующую функцию. Однако всякий раз, когда я использую .onclick , я в конечном итоге печатаю «2» на консоль, все еще при первом нажатии кнопки. Я тоже пробовал использовать .click , и единственное, что я могу найти, что работает, — это прямая настройка функции, однако это неаккуратно и долго. Я задавался вопросом, есть ли другой способ сделать это с более чистым кодом.

HTML:

 <!DOCTYPE html>
<html lang="en-US">
  <body>
    <script src="Path_To_File"></script>

      <p id="text">
        <!-- text here -->
      </p>

    <button id="b1" type="button" onclick="pageFlip(1)">Button</button>
  </body>
</html>
 

JS:

 function pageFlip(page) {
  var p = document.getElementById("text");
  var b1 = document.getElementById("b1");
  var b2 = document.getElementById("b2");

  switch (page) {
    case 1:
      p.innerHTML = "newText";
      b1.innerHTML = "newText";
      b1.onclick = pageFlip(2);
      break;
    case 2:
      console.log("2");
      break;
  }
}
 

Что работает:

 b1.onclick = function changeButton() {
    pageFlip(2)
}
 

Комментарии:

1. b1.onclick = PageFlip(2); вызывает PageFlip и назначает то, что он возвращает обработчику событий

2. Итак, как я могу установить свойство html непосредственно тогда?

3. например, как ты это сделал. Вам не нужно использовать именованную функцию. b1.onclick = function() {pageFlip(2)};