Форум

AntonMs · #1 (**permalink**) 27.04.2015, 01:30

Есть куча чекбоксов на странице, как мне в цикле узнать value каждого отмеченного?
P.S - без JQuery

рони · #2 (**permalink**) 27.04.2015, 01:56

AntonMs,
а в чём проблема то?

рони · #3 (**permalink**) 27.04.2015, 02:00

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <script>
  function init() {
    function fn(el) {
        return el.value
    }
  var arr =  Array.prototype.map.call(document.querySelectorAll("input:checked"), fn)
  alert(arr)
}
window.onload = init;
</script>
</head>
<body>
<input type="checkbox" value="1">
<input type="checkbox" value="2">
<input type="checkbox" value="3" checked="checked">
<input type="checkbox" value="4">
<input type="checkbox" value="5" checked="checked">

</body>

</html>

AntonMs · #4 (**permalink**) 27.04.2015, 02:32

СПАСИБО

Кстати почему не работает это:

input = formFilter.querySelectorAll('input')

for (i = 0; i < 10; i++){
	
if( input[i].checked ) { console.log( input[i].value ) }

}

forEach тоже не работает

рони · #5 (**permalink**) 27.04.2015, 03:01

AntonMs,
formFilter это что?

AntonMs · #6 (**permalink**) 27.04.2015, 04:03

formFilter = document.getElementById('form_filter')

рони · #7 (**permalink**) 27.04.2015, 07:17

AntonMs,
document.querySelectorAll("#form_filter input:checked") и скрипт вниз страницы

AntonMs · #8 (**permalink**) 27.04.2015, 20:38

спасибо

Rome. · #9 (**permalink**) 28.04.2015, 21:11

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>input[type=checkbox]</title>
</head>
<body>

 <div><input type="checkbox" value="1"></div>
 <div><input type="checkbox" value="2" checked="checked"></div>
 <div><input type="checkbox" value="3"></div>
 <div><input type="checkbox" value="4" checked="checked"></div>

 <script>
  var checkedInp;
  var inputs = document.getElementsByTagName('input');
  for (var i = 0; i < inputs.length; i++) {
    if (inputs[i].type == 'checkbox' &&
        inputs[i].checked) {
        checkedInp = inputs[i].value;
        alert(checkedInp)
    }
  }
 </script>

</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript