В дополнение к отмеченному и неотмеченному состояниям существует третье состояние, в котором может находиться флажок: неопределенное. Это состояние, в котором невозможно сказать, включен элемент или нет. Это устанавливается с помощью свойства HTMLInputElement объекта indeterminate через JavaScript (его нельзя установить с помощью атрибута HTML):

Флажок в неопределенном состоянии имеет горизонтальную черту (что-то вроде дефиса или знака минус) вместо флажка/галочки в большинстве браузеров.

Существует не так много вариантов использования этого свойства. Чаще всего это когда доступен флажок, который «владеет» несколькими подпараметрами (которые также являются флажками). Если отмечены все подпараметры, флажок владения также установлен, а если все они не отмечены, флажок владения снят. Если какой-либо один или несколько подпараметров имеют состояние, отличное от других, флажок-владелец находится в неопределенном состоянии.

Это можно увидеть в приведенном ниже примере (спасибо CSS Tricks за вдохновение). В этом примере мы отслеживаем ингредиенты, которые собираем для рецепта. Когда вы устанавливаете или снимаете флажок ингредиента, функция JavaScript проверяет общее количество проверенных ингредиентов:

Это можно увидеть в приведенном ниже примере (спасибо CSS Tricks за вдохновение). В этом примере мы отслеживаем ингредиенты, которые собираем для рецепта. Когда вы устанавливаете или снимаете флажок ингредиента, функция JavaScript проверяет общее количество проверенных ингредиентов:

Таким образом, в этом случае indeterminate состояние используется для обозначения того, что сбор ингредиентов начался, но рецепт еще не завершен.