Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   checkbox решаем что делать (https://javascript.ru/forum/dom-window/56280-checkbox-reshaem-chto-delat.html)

biryukovm 08.06.2015 12:42

checkbox решаем что делать
 
Привет всем. Что то я облазил поисковики и не нашел нормальной инфы.

У меня вопрос в следующем. Хотелось б все сделать на JS без Query.

Есть <input type="checkbox" class="fl_select" iid="'.$row["id"].'" '.$fl_select.'/>


Необходимо при клике определить стоит ли галочка или нет


Это для того чтобы решить какой запрос выполнить.


Пример кликнули по checkbox если стоит галочка высветилось сообщение стоит , если нет то сообщить что нет.

И при сообщении сменить checkbox. Если он был включен то выключить потом , если выключен то включить.

ksa 08.06.2015 13:49

Цитата:

Сообщение от biryukovm
Что то я облазил поисковики и не нашел нормальной инфы.
Хотелось б все сделать на JS без Query.

Есть
<input type="checkbox" class="fl_select" iid="'.$row["id"].'" '.$fl_select.'/>

Необходимо при клике определить стоит ли галочка или нет

Х/з где ты там лазил... :D Но есть событие onclick оно и поможет тебе в решении. ;)

pornoborets 08.06.2015 14:46

Цитата:

Сообщение от ksa
Но есть событие onclick оно и поможет тебе в решении

А конкретно? Как оно может помочь, если оно совпадает с изменением чекбокса, и, фактически, имеет мЕньший приоритет(инициируется уже после изменения)

ksa 08.06.2015 15:46

Цитата:

Сообщение от pornoborets
оно совпадает с изменением чекбокса, и, фактически, имеет мЕньший приоритет

Тогда используй событие onchange...

Endy 08.06.2015 15:53

pornoborets,
:-?
<!doctype html>
<html lang="en">
    
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    
    <body>
        <input type="checkbox" class="fl_select" id="row1" checked="checked" />
        <input type="checkbox" class="fl_select" id="row2" />
        <script>
            [].forEach.call(document.getElementsByClassName('fl_select'), function(e) {
                e.onclick = function() {
                    alert('Было ' + (!this.checked ? 'вкл' : 'выкл'));
                    alert('Стало ' + (this.checked ? 'вкл' : 'выкл'));
                }
            })
        </script>
    </body>

</html>

ksa 08.06.2015 16:39

С onchange аналогично...

<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=windows-1251' />
<!--
<script src='http://code.jquery.com/jquery-latest.js'></script>
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
<link rel="stylesheet/less" type="text/css" href="style.less">
<script src="http://cdnjs.cloudflare.com/ajax/libs/less.js/2.5.0/less.min.js"></script>
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
</script>
</head>
<body>
<input type="checkbox" class="fl_select" id="row1" checked="checked" />
<input type="checkbox" class="fl_select" id="row2" />
<script>
	[].forEach.call(document.getElementsByClassName('fl_select'), function(e) {
		e.onchange = function() {
			alert('Было ' + (!this.checked ? 'вкл' : 'выкл'));
			alert('Стало ' + (this.checked ? 'вкл' : 'выкл'));
		}
	})
</script>

</body>
</html>

pornoborets 08.06.2015 16:47

Endy,
То есть, Вы инвертируете, как-бы, значения. Но ведь, ТС'у надо было именно узнать значение поля до изменения. Получается, такого способа нет? И, остается вопрос, насколько Ваш метод надежен, в плане кроссбраузерности, и так далее. Ведь это, фактически, грязный хак, причем, извращенный, к тому же.

pornoborets 08.06.2015 16:48

ksa,
Спасибо, капитан.

Endy 08.06.2015 18:08

pornoborets,
Цитата:

Сообщение от pornoborets
То есть, Вы инвертируете, как-бы, значения. Но ведь, ТС'у надо было именно узнать значение поля до изменения.

Меняя текущее состояние на противоположное,мы и получаем предыдущее(до изменения).
Цитата:

Сообщение от pornoborets
И, остается вопрос, насколько Ваш метод надежен, в плане кроссбраузерности

Можно подключить полифиллы.
Цитата:

Сообщение от pornoborets
Ведь это, фактически, грязный хак, причем, извращенный, к тому же.

Предложите свой вариант,будет интересно посмотреть :)

pornoborets 08.06.2015 18:57

Цитата:

Сообщение от Endy
Предложите свой вариант,будет интересно посмотреть

Я не знаю.


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