Форум

malevi4 · #1 (**permalink**) 03.01.2017, 09:36

В форме есть два чекбокса, по сути надо сделать такой себе аналог радио, чтобы можно было выбрать только один инпун.

Со своими скупыми знаниями я написал банальный код, который снимает чекед с чекбокса А если жмешь на чекбокс Б и наоборот.

Проблема заключается в том, что если повторно жмешь на чекбокс, то оно снимает с него чекед. А нужно как на radio, чтобы при повторном клике оно не снимало с него чекед.

laimas · #2 (**permalink**) 03.01.2017, 10:14

Флажок, это не только один, а множество, так что ни о каком аналоге речи быть не может. Берите два type=radio и не выдумывайте велосипедов.

malevi4 · #3 (**permalink**) 03.01.2017, 10:17

увы, надо было сделать без radio по некоторым причинам.

а проблему решил с помощью $('checkbox').prop('checked', true).
изначально вместо prop у меня было прописано attr

laimas · #4 (**permalink**) 03.01.2017, 10:23

Сообщение от malevi4

надо было сделать без radio по некоторым причинам.

Офигеть, до чего мир катится.

Malleys · #5 (**permalink**) 03.01.2017, 10:26

<input type=radio name=a>
<input type=radio name=a>
<style>
[name=a][type=radio] {
    -moz-appearance: checkbox;
    -webkit-appearance: checkbox;
    appearance: checkbox;
}
</style>
<!-- Шутка -->

рони · #6 (**permalink**) 03.01.2017, 11:06

malevi4,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
    var a = $(":checkbox");
    a.on("click", function(b) {
        a.prop("checked", function(c) {
            return a[c] == b.target
        })
    })
});
  </script>
</head>

<body>
<input name="" type="checkbox">
<input name="" type="checkbox">
<input name="" type="checkbox">
<input name="" type="checkbox">
</body>
</html>

рони · #7 (**permalink**) 03.01.2017, 12:05

malevi4,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
    var a = $(":checkbox");
    a.on("change", function(b) {
        this.checked = true;
        a.not(this).prop("checked", false)
    })
});
  </script>
</head>

<body>
<input name="" type="checkbox">
<input name="" type="checkbox">
<input name="" type="checkbox">
<input name="" type="checkbox">
</body>
</html>

Форум

Справочник

Discord чат

Курсы javascript