@Raneto4ka

Как повесить два события на клик по элементу и вне его?

Есть поле input, изначально заблоченное. Нужно, что бы при клике на него появлялась возможность редактирования поля, а при клике вне его - снова появлялся статус readonly. (Там потом ешё в промежутке валидация будет).

Вот мой вариант https://jsfiddle.net/yo98uc75/10/
Но тут, во-первых, событие срабатывает на два поля, а надо только на текущее.
А во-вторых, мне не очень нравится, что проверятеся каждый клик по странице. Как можно переписать код, что бы эти события срабатывали только при клике на конкретный инпут, и вне его.
  • Вопрос задан
  • 233 просмотра
Пригласить эксперта
Ответы на вопрос 3
Vlad_IT
@Vlad_IT Куратор тега JavaScript
Front-end разработчик
Только не понятно, зачем вам такое извращение. Ведь если вводить символы в первое поле, а потом нажать на tab, то во второе не ввести.
Ответ написан
customtema
@customtema
arint.ru
<input class="target">

<script type="text/javascript">
	$(document).on('click', function(e) {
		if ($(e.target).hasClass('target'))
		{
			// отрабатываем клик на инпут
			$('.target').prop('disabled', false);
		}
		else
		{
			// отрабатываем клик вне инпута
			if ( ! $('.target').prop('disabled'))
			{
				$('.target').prop('disabled', true);
			}
		}

});

</script>


P.S. Есть подозрение, что саму задачу можно по-другому сформулировать.
Ответ написан
Комментировать
@Raneto4ka Автор вопроса
В итоге обошлась без скриптов. Спасибо всем, и отдельно тем, кто навёл на мысль стилизовать состояние :focus
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы