Управление флажками в HTML

Question

Я пытаюсь добавить вариант «Нет предпочтений» в свой список флажков, и я хотел бы, чтобы это происходило следующим образом:

1. Все выбранные флажки становятся не отмеченными, когда «Нет»Предпочтение "выбрано.

2. Если выбрано" Без предпочтения "и установлен другой флажок, то" Без предпочтения "становится невыбранным.

Вот что у меня есть: http://jsfiddle.net/VuS5R/1/

Спасибо за вашу помощь.

Answer 1

Мое предложение будет заключаться в том, чтобы поместить идентификатор в элемент ul.Затем вы можете использовать getElementByID и getElementsByTagName, чтобы установить флажки.Поскольку флажок «Нет предпочтений» является первым, привязайте событие к его щелчку, чтобы снять все флажки, если он установлен.

var checkboxes = document.getElementById('list').getElementsByTagName('input');
checkboxes[0].onclick = function(){
    if(checkboxes[0].checked){
        for(var i = 1; i < checkboxes.length; i++){
            checkboxes[i].checked = false;
        }
    }
}

Вот jsfiddle .

Answer 2

Элегантное решение от jQuery. У «No preference» есть класс «Nop», другие «pref»:

$(document).ready(function ()
{
   $(".Nop").click(function()
   {
        if ($(this).is(":checked"))
        {
             $(".pref").attr("checked", false);      
        }
    });
    $(".pref").click(function()
    {
          if ($(this).is(":checked"))
          {
               $(".Nop").attr("checked", false);      
          }
     });
});

Answer 3

1. Сначала вы должны присвоить каждому флажку уникальный идентификатор (в настоящее время все они имеют идентификатор = 1).

2. Затем вы изменили бы свое объявление «Нет предпочтений» на следующее:

   input type = "checkbox" id = "0" name = "BT" title = "No Preference" value = "0" selected = "check" onclick = "return NoPreference_ClientClick ()"

3. Вы добавите следующий JavaScript на свою страницу:

   функция NoPreference_ClientClick () { if ($ get ("0"). проверено) { $ get ("1"). check = $ get ("2"). checked = $ get ("3"). checked = $ get ("4"). checked = $ get ("5"). check = false; } еще { $ get ("1"). check = $ get ("2"). checked = $ get ("3"). checked = $ get ("4"). checked = $ get ("5"). check = true; } вернуть ложь; }

... надеюсь, вы получите образец!