Как прекратить выполнение функции при нажатии на элемент input?

Question

Феликс

javascript

Как прекратить выполнение функции при нажатии на элемент input?

Как можно остановить функцию, которая выводит текст в поле ввода, при нажатии на область этого поля?  <br/> <pre><code class="javascript">var delay = 55;
var nextm = 0;
var msg = new Array(
"111",
"222",
"333");
function start_pl_text() {
do(msg[0], 0, 1);
}
function do(text, pos, dir) {
var out = text.substring(0, pos);
document.getElementById("placeholder_text").placeholder =out;
pos += dir;
if(pos &gt; text.length)
setTimeout('do("' + text + '",' + pos + ',' + (-dir) + ')', delay*10);
else {
if(pos &lt; 0) {
if(++nextm &gt;= msg.length) nextm = 0;
text = msg[nextm];
dir = -dir;
}
setTimeout('do("' + text + '",' + pos + ',' + dir + ')', delay);
}
}
start_pl_text();</code></pre>

21 октября 2024 г. 9:52

Ответы на вопрос 2

Похожие вопросы

Answer 1

Чтобы остановить выполнение функции при нажатии на область поля ввода, можно использовать обработчик события `click` или `focus` на элементе `<input>`. В этом случае можно создать переменную, которая будет контролировать состояние выполнения функции и использовать её для прекращения её работы.

Вот как можно изменить ваш код:

```html
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <title>Пример остановки функции</title>
    <script>
        var delay = 55;
        var nextm = 0;
        var msg = new Array(
            "111",
            "222",
            "333"
        );
        var isRunning = true; // Переменная для отслеживания состояния выполнения

        function start_pl_text() {
            do(msg[0], 0, 1);
        }

        function do(text, pos, dir) {
            if (!isRunning) return; // Проверка на состояние выполнения
            var out = text.substring(0, pos);
            document.getElementById("placeholder_text").placeholder = out;
            pos += dir;

            if (pos > text.length) {
                setTimeout(() => do(text, pos, -dir), delay * 10);
            } else {
                if (pos < 0) {
                    if (++nextm >= msg.length) nextm = 0;
                    text = msg[nextm];
                    dir = -dir;
                }
                setTimeout(() => do(text, pos, dir), delay);
            }
        }

        // Функция для остановки текста
        function stopText() {
            isRunning = false; // Остановить выполнение
        }

        // Назначение обработчика события для поля ввода
        window.onload = function() {
            var inputElement = document.getElementById("placeholder_text");
            inputElement.addEventListener("click", stopText); // Остановка при клике
            inputElement.addEventListener("focus", stopText); // Остановка при фокусе
            start_pl_text(); // Запуск функции
        };
    </script>
</head>
<body>
    <input type="text" id="placeholder_text" placeholder="Текст будет здесь...">
</body>
</html>
```

В этой реализации:

- Мы добавили переменную `isRunning`, чтобы отслеживать, выполняется ли текстовое обновление.
- Функция `stopText` устанавливает `isRunning` в `false`, что позволяет функции, выводящей текст, завершиться.
- Мы назначили обработчики события `click` и `focus` на элемент `<input>`, чтобы остановить выполнение при взаимодействии пользователя с полем ввода.

Когда пользователь нажимает или фокусируется на поле ввода, обновление текста прекращается.

Answer 2

var timeoutId;
// ...
timeoutId = setTimeout(...
// ...
timeoutId = setTimeout(...
// ...
function stop() {
  clearTimeout(timeoutId);
}
document.getElementById("placeholder_text").click = stop;
 
 
 Ну и не называй функцию do , есть ключевое слово do ... while .