Как задать вызвать сообщение об ошибке invalid input через js?

Question

[Андрей]

Для того, чтобы перейти по ссылке на следующую страницу сайта, нужно отметить чекбокс. Ссылка-кнопка и чекбокс находятся не в одной форме и они никак между собой не связаны. Нужно через js вызвать у чекбокса стандартное сообщение об ошибке, если человек пытается перейти на другую страницу, не отметив чекбокс

let checkbox = document.querySelector('.text #checkbox'),
    btnAgree = document.querySelector('.page-terms #agree-btn')
	
    btnAgree.addEventListener('click', e => {
		if (checkbox.checked) {} 
    else {
			e.preventDefault();
			//здесь нужно вызвать сообщение
		}
	});

Как это можно реализовать?

Comments

[zombtron]

Сделать ссылку сабмитом формы и затолкать в эту форму чекбокс с required.

Answer 1

[Олег]

Что-то такое вы хотели?

Comments

[Андрей]

Нужен именно обычное стандартное браузерное сообщение об ошибке, как на скрине. Если делать кастомное в этом месте, то придется делать и во всех остальных, а это в планы не входит

[Олег]

Андрей, чекбокс может иметь только два состояния: отмеченный и неотмеченный, других состояний у него нет. предусмотренное сообщение можно выводить командой alert('ваш_текст'), но по дизайну это совсем не то, что на рисунке.
Хотя на js есть интерфейс валидации, вам в этом направлении HTMLObjectElement.setCustomValidity.