Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   Как подобное реализовать на чистом js? (https://javascript.ru/forum/misc/58103-kak-podobnoe-realizovat-na-chistom-js.html)

AntonMs 04.09.2015 22:00

Как подобное реализовать на чистом js?
 
Как подобное реализовать на чистом js, что-бы не прописывать кучу .onchange событий к каждому чекбоксу?
$(document.querySelectorAll('input[type=checkbox]')).change(function(){
console.log(this.value)
})

Lemme 04.09.2015 22:13

че, прям всем всем на странице?
http://javascript.ru/forum/css-html/...tml#post387197

Там не про события, но метод тот же.

А лучше использовать делегирование
https://learn.javascript.ru/event-delegation

caetus 04.09.2015 22:14

<body>
	<div id="div">

		<input type="checkbox">
		<input type="checkbox">
		<input type="checkbox">
		<input type="checkbox">
		<input type="checkbox">
	</div>
</body>
[JS]
<script>
	
var div = document.getElementById('div');

div.addEventListener('change', function (e) { 
	e = e.target || e.srcElement;
	console.log(e.value)
	
},false)

</script>
[/JS]

forwardonly2015 04.09.2015 22:16

<html>

<head>
<meta charset="utf-8">

</head>

<body>

<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">
<input type="checkbox">


<script>



show=function(){alert(1)}
;[].forEach.call(document.querySelectorAll('input[type=checkbox]'), function(box){box.onchange=show})






</script>
</body>
</html>

caetus 04.09.2015 22:18

forwardonly2015,
мне кажется он тоже самое сделал только на Jquery

forwardonly2015 04.09.2015 22:20

caetus,
Ну так он и спрашивал, как сделать это на чистом

Lemme 04.09.2015 22:21

tsigel, а зачем в два прохода то?

caetus 04.09.2015 22:22

ты прав я невнимательно прочёл )

AntonMs 04.09.2015 22:39

Спасибо, подучился :)

tsigel 05.09.2015 00:09

Lemme,
Затупил


Часовой пояс GMT +3, время: 07:55.