Как я могу запретить пользователю устанавливать несколько флажков в HTML?

#html #checkbox

#HTML #флажок

Вопрос:

Как я могу запретить пользователю устанавливать несколько флажков в HTML?

1. Не могли бы вы уточнить? Флажок на самом деле не имеет «множественного выбора». Это один элемент с двумя возможными состояниями, отмеченный или непроверенный. Может быть, вы ищете переключатели?

2. Используя вместо этого переключатели?

Ответ №1:

вы должны изменить его на переключатель вместо флажка!

 <input type="radio" name="group1" id="item1" value="Milk">
<label for="item1">Milk</label>
<br/>
<input type="radio" name="group1" id="item2" value="Butter" checked>
<label for="item2">Butter</label>
<br/>
<input type="radio" name="group1" id="item3" value="Cheese">
<label for="item13">Cheese</label>

Ответ №2:

У меня был вариант использования, когда мне нужно было использовать флажки, которые, в отличие от переключателей, позволяют пользователю снимать флажок… Вот пример того, что я собрал по кусочкам от другого пользователя stackoverflow:

 <head>
    <meta charset=utf-8 />
    <title>and-or checkboxes</title>
    <script src="http://code.jquery.com/jquery-1.4.4.js"></script>
</head>

<body>

    <label for="checkbox1"><input type="checkbox" id="checkbox1" name="checkbox1" value="and" </label><span id="span_and">checkbox1</span><br>

    <label for="checkbox2"> <input type="checkbox" id="checkbox2"  name="checkbox2"  value="or" </label><span id="span_or">checkbox2</span>

    <script>

        $(document).ready(function(){
            $('#checkbox1').click(function() {
            var checkedBox = $(this).attr("checked");
                if (checkedBox === true) {
                    $("#checkbox2").attr('checked', false);
                } else {
                    $("#checkbox2").removeAttr('checked');                    
                }
            });
        });

        $(document).ready(function(){
            $('#checkbox2').click(function() {
            var checkedBox = $(this).attr("checked");
                if (checkedBox === true) {
                    $("#checkbox1").attr('checked', false);                     
                } else {
                    $("#checkbox1").removeAttr('checked');                       
                }
            });
        });

    </script>

</body>

Немного поработав, вы можете объединить один / или два сценария в один скрипт. Возможно, вам это сейчас не нужно, но я хотел опубликовать это, потому что это было очень полезно для меня.

Ответ №3:

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

Ответ №4:

Если вы имеете в виду, что не хотите, чтобы одновременно устанавливалось несколько флажков из одной и той же «логической группы», вам следует использовать переключатели вместо флажков.

 <form>
    <input type="radio" name="aGroup" value="choice1" /> Choice #1<br />
    <input type="radio" name="aGroup" value="choice2" /> Choice #2
</form>

Используя это, за один раз можно установить только 1 параметр

Ответ №5:

Используйте Radio, и они должны быть одинаковыми name="" .