Как сделать так, чтобы onclick срабатывало только 1 раз?
 

Надо сделать защиту от дурака ошибки. Сейчас, при однократном нажатии кнопки значение поля изменяется. Очень желательно, чтобы при повторном нажатии изменений поля не происходило, либо, если это невозможно, при повторном нажатии мыши (скажем более 1 раза) происходило некое событие, например, менялся цвет поля (это я сам сделаю - примера с alert будет достаточно).

Читал stackoverflow, но одобренных решений не нашел.

Всем спасибо за внимание, нашел! :)

if (!clicked) {
// Set clicked to true
clicked = true;
}

Там ещё были варианты, но этого хватило. :)

Но идеологически это не правильный вариант. Потому что бесполезное событие продолжает висеть.

Правильно делать так:

element.addEventElistener('click', function() {
  // ...
}, {
  once: true
})

element.addEventListener('click', function() {  } , {once : true});

https://learn.javascript.ru/introduction-browser-events

Оно может чему-то помешать или навредить?

Вам, экспертам javascript - хорошо, а мне далеко не всё понятно в ваших примерах. При этом в "if" я могу засунуть изменение цвета "псевдокнопки" (тег span), чтобы визуально было понятно, что она уже нажата.

Сейчас мой код выглядит так:

<script>
var clicked = false;

function example1() {

	if (!clicked) {
	// Set clicked to true
	clicked = true;

Здесь выполняем необходимые действия.

	}

}
</script>

Где должна быть указанная Вами и Вашим коллегой строка?

Не стоит оставлять то, что потом будет не нужно. ;)

Это можно сделать в этом же обработчике или в другом обработчике, который так же навесить после отработки первого события...

Т.е. использовать глобальную переменную для такого дела вообще не стоит. :no:

После собственно определения элемента (в ДОМ), на который и будет навешиваться событие.

Как вариант...

<button id='element'>Тест</button>
<script>
element.addEventListener('click', function() {  
	alert('Меняем')
	element.addEventListener('click', function() {  
		alert('Нет')
	});
} , {once : true});
</script>

Но я не могу использовать "button", а при использовании "span" это не работает.

Все работает со span

<span id='element'>Тест</span>
<script>
element.addEventListener('click', function() { 
    alert('Меняем')
    element.addEventListener('click', function() { 
        alert('Нет')
    });
} , {once : true});
</script>