Javascript-форум (https://javascript.ru/forum/)
-   Общие вопросы Javascript (https://javascript.ru/forum/misc/)
-   -   сворачивать div при onclick на span (https://javascript.ru/forum/misc/56660-svorachivat-div-pri-onclick-na-span.html)

djonA 27.06.2015 15:39

сворачивать div при onclick на span
 
Подскажите, есть произвольное количество div на странице и у каждого есть свой span нужно при клике на span сворачивать его личный div.

Но сложность в том что span идет над divа не внутри.

Помогите реализовать:

<span onclick="свернуть div">Свернуть</span>
<div class="div">1</div>

<span onclick="свернуть div">Свернуть</span>
<div class="div">2</div>

<span onclick="свернуть div">Свернуть</span>
<div class="div">3</div>

<span onclick="свернуть div">Свернуть</span>
<div class="div">4</div>

рони 27.06.2015 15:53

djonA,
открывашек 219 уже вам маловато?

djonA 27.06.2015 16:42

хочу написать универсальный код который сворачивал бы div'ы.

если сделать span внутри div'а то получится сделать, а вот если снаружи как сделать что бы сворачивать тот div который относится к этому span?

рони 27.06.2015 17:17

djonA,
и ваш вариант тоже есть :cray:

Deff 27.06.2015 17:51

http://javascript.ru/blog/seoneo/Pol...enie-smezhnyh-

рони 27.06.2015 18:19

Открывашка 220 дубль
 
djonA,
http://javascript.ru/forum/dom-windo...tml#post312642
<!DOCTYPE HTML>
<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
    span { display:  block; cursor: pointer;}
</style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
   $(function ()
{
      $('.div').each(function(index, el) {
        var a = $(this).prev();
        a.click(function() {
          $(el).slideToggle(200);
      return false;
    });
  });

})
  </script>
</head>

<body>
<span onclick="свернуть div">Свернуть</span>
<div class="div">1</div>

<span onclick="свернуть div">Свернуть</span>
<div class="div">2</div>

<span onclick="свернуть div">Свернуть</span>
<div class="div">3</div>

<span onclick="свернуть div">Свернуть</span>
<div class="div">4</div>

</body>
</html>


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