Я хочу, чтобы function перестать работать при нажатии кнопки в Javascript.

Я пытаюсь использовать if инструкцию, чтобы проверить, нажата кнопка или нет. Кроме того, я попытался заставить функцию перестать работать, когда в другой функции выполняется определенное условие.

Однако это все равно больше не работает.

Кто-нибудь знает, как заставить это работать и почему onclick == true это больше не работает?

 let textarea = document.getElementsByTagName('textarea')[0]
let message = document.getElementById('message')

function clicks() {
  console.log('hi')
  //I want to make the appear function stop working when this function is executing.
}

function appear() {
  //this is not working
  if (document.getElementsByTagName('button')[0].onclick == true) {
    message.style.display = 'none'
    console.log('it works')
  } else {
    message.style.display = 'revert'
    textarea.value = textarea.value.trimStart();
  }
}; 

 <textarea></textarea>
<div id="message">.....</div>
<button onclick="clicks()">split(20px)</button> 

onclick это событие, которое сработало, когда click произошло событие. В результате onclick не сохраняет состояние. Вам нужно создать переменную, видимую для clicks appear функций и, и использовать ее для определения флага, чтобы остановить выполнение функции appear .

     let textarea = document.getElementsByTagName('textarea')[0];
    let message = document.getElementById("message");
    let stopButtonClicked = false;

    function clicks() {
        console.log("hi");
        stopButtonClicked = true;
    }

    function appear() {
        if (stopButtonClicked) {
            message.style.display = "none";
            console.log("it works");
        } else {
            message.style.display = "revert";
            textarea.value = textarea.value.trimStart();
        }
    }
 

Вам нужно применить семафорную логику, например:

 let beingClicked = false;
function clicks() {
  
  beingClicked = true;
  console.log('hi');
  //I want to make the appear function stop working when this function is executing.
  beingClicked = false;
}

function appear() {
  //this is not working
  if (beingClicked) {
    message.style.display = 'none'
    console.log('it works')
  } else {
    message.style.display = 'revert'
    textarea.value = textarea.value.trimStart();
  }
};
 

Обратите внимание , что в начале function мы устанавливаем семафор ( beingClicked ) на красный (что true в данном случае), а в конце function мы устанавливаем его на false .

Важно отметить, что необходимо рассмотреть еще две проблемы:

1

Возможно, вам потребуется повторно использовать эту логику для других кнопок. Если это так, то вы могли бы рассмотреть следующее:

 function ButtonSemaphore(button) {
    let semaphore = false;
    let events = [];
    button.addEventListener("click", function(evt) {
        semaphore = true;
        for (let event of events) event(evt);
        semaphore = false;
    });
    function isRed() {
        return semaphore;
    }
    function isGreen() {
        return !semaphore;
    }
    function addEvent(callback) {
        events.push(callback);
    }
}
 

Вы можете создать этот экземпляр , вызвав его как let myButtonSemaphore = new ButtonSemaphore(button) , где button находится допустимая кнопка. Всякий раз, когда вы хотите добавить к нему событие, просто позвоните myButtonSemaphore.addEvent(function(evt) {/* Some code */}) . Обратите внимание, что массив событий обработан и семафор установлен правильно до всех событий и после всех событий.

2

Возможно, вам потребуется повторно использовать это, поэтому рекомендуется создать собственный файл .js, чтобы ваш код существовал ровно один раз и был доступен для импорта при необходимости.