Javascript-форум - Создать кнопку с событием

Javascript-форум (https://javascript.ru/forum/)

- Общие вопросы Javascript (https://javascript.ru/forum/misc/)

- - Создать кнопку с событием (https://javascript.ru/forum/misc/51863-sozdat-knopku-s-sobytiem.html)

Создать кнопку с событием

Доброго времени суток. В JS новичек. Такая проблема хочу создать кнопку, при нажатии на которую создается еще кнопка. Изначально создано две кнопки "Автомат" и "Ручное". При нажатии на Ручное должно создать внизу(под Ручным) кнопку. Вот код

var a= 0;
   onload = function vizovRuchnoi(){
      if (a == 0) {
          var btn = document.createElement('input');
          btn.id = 'b1';
          btn.type = 'button';
          btn.value = 'Ручное переключение';

          document.body.appendChild(btn);
          document.getElementById('b1').onclick = sozdaemTriKnopki();
          btn.setAttribute('onclick', 'sozdaemTriKnopki');

          var btn1 = document.createElement('input');
          btn1.id = 'b2';
          btn1.type = 'button';
          btn1.value = 'Автоматическое переключение';
          btn1.setAttribute('onclick', 'obj.HandleClick1();');
          document.body.appendChild(btn1);
          a = 1;
      }
   }
var b =0;
function sozdaemTriKnopki(){
   if ( b== 0){
       var btn = document.createElement('input');
       btn.id = 'b1_1';
       btn.type = 'button';
       btn.value = 'Красный11';
       document.body.appendChild(btn);
       b = 1;
   }
}

Цитата:

Сообщение от Vladimir93

document.getElementById('b1').onclick = sozdaemTriKnopki();11 btn.setAttribute('onclick', 'sozdaemTriKnopki');

или
btn.onclick = sozdaemTriKnopki;
или
document.getElementById('b1').onclick = sozdaemTriKnopki

Цитата:

Сообщение от рони (Сообщение 342386)

или
btn.onclick = sozdaemTriKnopki;
или
document.getElementById('b1').onclick = sozdaemTriKnopki

Я пробовал и так и так. Оно то кнопку создает, но сразу при загрузку страницу, как будто метод sozdaenTrKnopki вызывается сразу. А надо, чтобы после нажатия мыши. ЧТо не так?

Vladimir93,
сделай как написано выше

Vladimir93,
:-/

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title><meta charset="utf-8">
  <script>
    var a= 0;
   onload = function vizovRuchnoi(){
      if (a == 0) {
          var btn = document.createElement('input');
          btn.id = 'b1';
          btn.type = 'button';
          btn.value = 'Ручное переключение';

          document.body.appendChild(btn);

          btn.onclick = sozdaemTriKnopki;

          var btn1 = document.createElement('input');
          btn1.id = 'b2';
          btn1.type = 'button';
          btn1.value = 'Автоматическое переключение';
         // btn1.setAttribute('onclick', 'obj.HandleClick1();');
          document.body.appendChild(btn1);
          a = 1;
      }
   }
var b =0;
function sozdaemTriKnopki(){
   if ( b== 0){
       var btn = document.createElement('input');
       btn.id = 'b1_1';
       btn.type = 'button';
       btn.value = 'Красный11';
       document.body.appendChild(btn);
       b = 1;
   }
}

  </script>
</head>

<body>

</body>

</html>

Цитата:

Сообщение от рони (Сообщение 342391)

Vladimir93,
сделай как написано выше

Блин. Спасибо. До этого писал только на Java, и там методы вызываются только с (), а здесь не так...

Тогда такой вопрос, что в стилях надо указать, чтобы кнопка внизу создалась, а не последовательно в строку...

Vladimir93,

#b1_1{
  display: block;
}

Рони, можно еще вопрос. Допустим у меня есть две кнопки, идущие в линию. При нажатии на одну создаются 4-ре кнопки внизу в столбец в помощью display: block. А как добавить четвертую не в столбец, а в ту линию, где две первоначальные?

Цитата:

Сообщение от рони (Сообщение 342392)

Vladimir93,
:-/

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title><meta charset="utf-8">
  <script>
    var a= 0;
   onload = function vizovRuchnoi(){
      if (a == 0) {
          var btn = document.createElement('input');
          btn.id = 'b1';
          btn.type = 'button';
          btn.value = 'Ручное переключение';

          document.body.appendChild(btn);

          btn.onclick = sozdaemTriKnopki;

          var btn1 = document.createElement('input');
          btn1.id = 'b2';
          btn1.type = 'button';
          btn1.value = 'Автоматическое переключение';
         // btn1.setAttribute('onclick', 'obj.HandleClick1();');
          document.body.appendChild(btn1);
          a = 1;
      }
   }
var b =0;
function sozdaemTriKnopki(){
   if ( b== 0){
       var btn = document.createElement('input');
       btn.id = 'b1_1';
       btn.type = 'button';
       btn.value = 'Красный11';
       document.body.appendChild(btn);
       b = 1;
   }
}

  </script>
</head>

<body>

</body>

</html>

кстати, а если в методе будет аргумент, тогда работать не будет?