Как создать метод «проверить все» JavaScript

Question

Мне интересно, как я могу создать кнопку, которая вызывает метод JavaScript, который все флажки в таблице h: table (простая таблица html) проверяются? И как я могу снова установить все флажки в таблицу с помощью метода JavaScript? Можете ли вы показать мне фрагмент кода или рабочий пример?

Answer 1

Вы могли бы сделать это с помощью JQuery очень легко:

Проверьте все

$("[type=checkbox]").prop("checked", true); 

отмените выбор всех:

$("[type=checkbox]").prop("checked", false); 

Так с помощью кнопки:

<input type="checkbox" name="a">a<br/> 
<input type="checkbox" name="b">b<br/> 
<input type="checkbox" name="c">c<br/> 
<input type="checkbox" name="d">d<br/> 
<input type="checkbox" name="e">e<br/> 
<button data-action="check">Check All</button> 
<button data-action="uncheck">Uncheck All</button>​ 

$('button').click(function() { 
    $("[type=checkbox]").prop("checked", $(this).data('action') === 'check'); 
})​ 

скрипку: http://jsfiddle.net/Bn386/

Answer 2

<h:table> 
    <input type="checkbox" /> 
    <input type="checkbox" /> 
</h:table> 

<script> 
    function checkBoxesForMe(checkBoxesOn) 
    { 
     var table = document.getElementsByTagName('h:table')[ 0 ] 
     var inputs = table.getElementsByTagName('input') 

     for(var i = 0; i < inputs.length; i ++) 
     { 
      if(inputs[ i ].type == 'checkbox') 
      { 
       if(checkBoxesOn) 
        inputs[ i ].setAttribute('checked', true) 
       else 
        inputs[ i ].removeAttribute('checked') 
      } 
     } 
    } 
</script> 

Answer 3

1. кнопку Создать
2. Add an event listener к кнопке. В слушателе выполните следующие действия:
   1. выберите элемент таблицы, где вы хотите проверить все поля, например. by Id
   2. Использование getElementsByTagName для входных элементов
   3. Loop над списком входов:
      • Если тип the input является "флажок", установите его свойство checked в true

Answer 4

Следующие функции должны быть само собой разумеющимися:

function checkboxesCheckAll() { 
    var boxes = document.getElementsByTagName('input'); 
    var i = boxes.length; 
    while (i--) { 
    if (boxes[i].type == 'checkbox') boxes[i].checked = true; 
    } 
} 

function checkboxesCheckNone() { 
    var boxes = document.getElementsByTagName('input'); 
    var i = boxes.length; 
    while (i--) { 
    if (boxes[i].type == 'checkbox') boxes[i].checked = false; 
    } 
} 

function checkboxesCheckToggle() { 
    var boxes = document.getElementsByTagName('input'); 
    var i = boxes.length; 
    while (i--) { 
    if (boxes[i].type == 'checkbox') boxes[i].checked = !boxes[i].checked; 
    } 
} 

Или вы могли бы написать его как одну функцию и передать параметр для проверки, снятия или переключения.