Как можно отключить обработку события, не изменяя его имя?

Question

Lillian

javascript

Как можно отключить обработку события, не изменяя его имя?

Как можно реализовать отключение обработчика события `change` таким образом, чтобы при этом сохранялось имя функции `SelectChange()`? Это необходимо для того, чтобы иметь возможность назначить событие `onchange` функции `SelectChange()` без необходимости знать ее имя. <br/> <br/> <pre><code class="html">&lt;html&gt;
&lt;body&gt;
&lt;button onclick="ButtonStop()"&gt;Stop Event&lt;/button&gt;
&lt;select onchange="SelectChange()"&gt;
 &lt;option&gt;1&lt;/option&gt;
 &lt;option&gt;2&lt;/option&gt;
&lt;/select&gt;
&lt;script&gt;
 function ButtonStop()
 {
  document.querySelector("select").onchange = null;/*Какой код можно использовать вместо 
строки перед комментарием, чтобы отключить обработчик без сброса имени функции?*/
 }

 function SelectChange()
 {
  alert("Changed!");
 }
&lt;/script&gt;
&lt;style&gt;
 body
 {
  text-align: center;
 }
&lt;/style&gt;
&lt;/body&gt;
&lt;/html&gt;</code></pre>

28 августа 2024 г. 7:14

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

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

Answer 1

Чтобы отключить обработку события без изменения имени функции, можно использовать метод `removeEventListener()`. Однако для этого нужно сначала добавить обработчик события с помощью `addEventListener()`, а не через атрибут `onchange`. В таком случае можно сохранить ссылку на функцию и затем отключить её при необходимости.

Вот как можно переписать ваш код для достижения этой цели:

```html
<html>
<body>
<button onclick="ButtonStop()">Stop Event</button>
<select id="mySelect">
  <option>1</option>
  <option>2</option>
</select>
<script>
  // Сначала создадим именованную функцию обработчик
  function SelectChange() {
    alert("Changed!");
  }
  
  // Теперь добавим обработчик события onchange
  const selectElement = document.getElementById("mySelect");
  selectElement.addEventListener("change", SelectChange);

  function ButtonStop() {
    // Отключаем обработчик события
    selectElement.removeEventListener("change", SelectChange);
  }
</script>
<style>
  body {
    text-align: center;
  }
</style>
</body>
</html>
```

В этом коде:

1. Используется `addEventListener()` для привязки обработчика события `SelectChange`.
2. `removeEventListener()` используется в функции `ButtonStop()`, чтобы отключить обработчик, сохраняя при этом имя функции.

Answer 2

let fEnabled = true;

function ButtonStop()
{
  fEnabled = false;
}

function SelectChange()
{
  if (fEnabled) {
    alert("Changed!");
  }
}