Как остановить запуск функции после того, как я использую другую функцию через onclick? - PullRequest
Новая
       11

Как остановить запуск функции после того, как я использую другую функцию через onclick?

0 голосов
/ 25 марта 2020

Я пытался создать Graph Simulator, где пользователь может вставить вершину (точка / ar c) и соединить ее линией. Моя проблема здесь заключается в том, что всякий раз, когда я вызываю функцию для добавления вершины (функция AddVertex ()), а затем вызываю функцию для соединения вершин (функция Connect ()), функция AddVertex () все еще выполняется с функцией Connect (). Это означает, что это линия * dr aws с дугами на конце.

То, что я пытаюсь сделать, это то, что программа должна запускать только одну функцию за раз, то есть, если я вызываю AddVertex (), она должна рисовать точки / дуги только когда я нажимаю на холсте, то же самое на Connect (), он должен рисовать линии только когда я нажимаю на холст, а не с дугами на его конце. Я использовал другие методы, такие как отключение, используя if else, но он не работает.

Вот мой HTML и Javascript код:

HTML: 

<div id = "ButtonSection">

    <BUTTON id = "addvertex" onclick = "AddVertex()"><B>(+) Add Vertex</B></BUTTON>
    <BUTTON id = "connect"  onclick = "Connect()"><B>Connect Vertex</B></BUTTON>
 </div>



<canvas id= "CanvasArea" width = "700px" height = "600px">
</canvas>


</BODY>

JAVASCRIPT:

функция AddVertex () {..... 

        function GetXYPosition(event)
                {
                     .....
                }

        function DrawArc(event)
                {
                     .....
                }

}

функция Connect () {

   ....

            function GetCursorPosition(event)
            {        
                .....     
            }

            function DrawLine(event)
            {
               .....
                }

}

1 Ответ

0 голосов
/ 26 марта 2020

Если вы хотите, чтобы функции запускались, когда пользователь нажимает на холст, вы должны использовать обработчик событий для canvas.onclick. Лично я никогда не пытался по-настоящему определять попадания на холсте, но многие программы отслеживают вещи на холсте в отдельном объекте. Вы также можете просто обнаружить попадание, выбрав цвет холста под курсором.

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

var flag = false;
function one() {
    if (flag) return;
    flag = true;
    // do something important
    console.log('function one running');
    flag = false;
}

function two() {
    if (flag) return;
    flag = true;
    // do something else
    console.log('function two running');
    flag = false;
}

Если бы вам нужно было очень быстро вызвать one(), а затем two(), то было бы зарегистрировано только function one running, потому что flag установлено в true и блокирует two() от выполнения.

...