3

Как сымитировать нажатие на кнопку нажатием по другой кнопку?

.hider-recipient {
display: block;
margin-top: 20px;
}
<button class="hider">Нажать на "Кнопку 1"</button>
<button class="hider-recipient">Кнопка 1</button>

2 ответа 2

7

function triggerButton1Click() {
  document.querySelector(".hider-recipient").dispatchEvent(new Event("click"));
}
.hider-recipient {
  display: block;
  margin-top: 20px;
}
<button class="hider" onclick="triggerButton1Click()">Нажать на "Кнопку 1"</button>
<button class="hider-recipient" onclick="console.log('Кнопка 1 clicked')">Кнопка 1</button>

3
  • вариант document.querySelector(".hider-recipient").click() для самых ленивых 27 мар 2020 в 16:23
  • Выдает ошибку "Uncaught ReferenceError: triggerButton1Click is not defined at HTMLButtonElement.onclick ((index):957)"
    – Alex
    27 мар 2020 в 16:25
  • @QuickBrownFox Нет, не выдает. Нажмите кнопку "Выполнить код" в ответе.
    – user176262
    27 мар 2020 в 16:29
4

    window.onload = function () {
        let but1 = document.getElementsByClassName('hider')[0]; // Получаем элемент по классу
        let but2 = document.getElementsByClassName('hider-recipient')[0];  // Получаем элемент по классу

        but1.addEventListener('click', function () { // При нажатии первой кнопки
            but2.click(); // нажимаем вторую
        });
        but2.addEventListener('click', function () { // Для демонстрации - при нажатии на вторую кнопку
            console.log('Вторая кнопка нажата'); // выводим сообщение в консоль
        })
    }
<style>
    .hider-recipient {
        display: block;
        margin-top: 20px;
    }
</style>
<button class="hider">Нажать на "Кнопку 1"</button>
<button class="hider-recipient">Кнопка 1</button>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.