Форум

SaM1001 · #1 (**permalink**) 03.03.2017, 16:45

Ребят, подскажите в какую сторону смотреть, не говорите сразу ответа или решение вопроса, хочу сам дойти. Я ведь только учусь.

Вот собственно код jQuery:

$(":checkbox").click(function (event) {
        if ($(this).is(":checked"))
            $("opt_" + i + "").show();
        else
            $("opt_" + i + "").hide();
    });

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

<input type="checkbox" class="checkbox" id="opt_0"/>
	<input type="checkbox" class="checkbox" id="opt_0"/>
	<input type="checkbox" class="checkbox" id="opt_0"/>

вот такие вот примерно объекты:

<div class="widget" id="opt_0"></div>
	<div class="widget" id="opt_1"></div>
	<div class="widget" id="opt_2"></div>

Заранее спасибо

рони · #2 (**permalink**) 03.03.2017, 16:51

SaM1001,
это что

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

+ i + "

?

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

$("opt_" + i + "")

и это?

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

id="opt_0"/

??? что такое id, читали?

SaM1001 · #3 (**permalink**) 03.03.2017, 16:55

кажется уже тоже увидел... сорри

$("#opt_" + i + ' .checkbox')

Вот так наверное будет работать, сейчас попробую

SaM1001 · #4 (**permalink**) 03.03.2017, 16:58

не, добавил переменную i

$(":checkbox").click(function (event) {
        var i = 0;
        if ($(this).is(":checked"))
            $("#opt_" + i + ' .checkbox').show();
        else
            $("#opt_" + i + ' .checkbox').hide();
    });

и тоже не получается

UPD

$("#opt_" + i)

исрпавил на вот так и тоже без результата(((

UPD 2

и вот так тоже не хочет работать

$("#opt").hide();
    $('input[type="checkbox"]').click(function () {
        $(this).next("#opt").show(this.checked);
    });

естественно opt_1, opt_2... исправил в .html тоже

рони · #5 (**permalink**) 03.03.2017, 17:43

SaM1001,
на форуме более 300 открывашка , посмотрите их код.

рони · #6 (**permalink**) 03.03.2017, 17:50

SaM1001,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    .widget {
      display: none;
    }

  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {
  var c = $(".checkbox"), d = $(".widget");
  c.on("click",function() {
  var i = c.index(this);
  d.eq(i).toggle()
})
});
  </script>
</head>

<body>

<input type="checkbox" class="checkbox" />
<input type="checkbox" class="checkbox" />
<input type="checkbox" class="checkbox" />

<div class="widget" >1</div>
<div class="widget" >2</div>
<div class="widget" >3</div>


</body>
</html>

SaM1001 · #7 (**permalink**) 03.03.2017, 18:02

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

PS: Как тебе карму тут поправить, не могу плюсануть тебе, заставляют куму-нить другому сначала поставить отзыв?

Форум

Справочник

Discord чат

Курсы javascript