Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 19.11.2015, 13:24
Новичок на форуме
Отправить личное сообщение для saper333 Посмотреть профиль Найти все сообщения от saper333
 
Регистрация: 19.11.2015
Сообщений: 9

Удаление и восстанавелние элементов (jquery)
Здравствуйте. Задачи состоит в следующим, есть много элементов с class="j" которые должны удалится после загрузки страницы, и есть элементы с class="c" которые являются соседними элементами с class="j" и при нажатии на которых должно происходить восстановление элементов с class="j", но не всех, а именно тех который являются соседним нажатого элемента class="c".

структура:

<div>
<div class="c"></div>
<div class=j"></div>
</div>
<div>
<div class="c"></div>
<div class=j"></div>
</div>
<div>
<div class="c"></div>
<div class=j"></div>
</div>


<script>

$(document).ready(function() {
var zag1 = $('.j).detach();
$('.c').live('click', function(e){
$(this).parent().append(zag1);
});
});

</script>

Данный скрипт работает неправильно, он удаляет все элементы с class="j" при загрузке, но при клике на class="c" восстанавливает не соседний удалённый элемент с class="j", а все элементы с class="j". то есть получается вот так:

<div>
<div class="c"></div>
</div>
<div>
<div class="c"></div> ( элемент по которому кликнули )
<div class=j"></div>
<div class=j"></div>
<div class=j"></div>
</div>
<div>
<div class="c"></div>
</div>



а должно получиться вот так:

<div>
<div class="c"></div>
</div>
<div>
<div class="c"></div> ( элемент по которому кликнули )
<div class=j"></div>
</div>
<div>
<div class="c"></div>
</div>

Пожалуйста помогите люди добрые, уже несколько дней себе голову ломаю...
Ответить с цитированием
  #2 (permalink)  
Старый 19.11.2015, 14:12
Профессор
Отправить личное сообщение для Mess4me Посмотреть профиль Найти все сообщения от Mess4me
 
Регистрация: 03.11.2014
Сообщений: 263

saper333,
так
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        div {
            border: 1px solid;
        }

    </style>
    <title>Document</title>
    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<div>
    <div class="c">1</div>
    <div class="j" id="m">2</div>
</div>
<div>
    <div class="c">1</div>
    <div class="j">2</div>
    <div class="j">3</div>
    <div class="j">4</div>
</div>
<div>
    <div class="c">1</div>
    <div class="j">2</div>
    <div class="j">4</div>
    <div class="j">3</div>
    <div class="j">7</div>
</div>

<script>
    $(document).ready(function () {
        $('.j').hide();

        $('.c').click(function () {
            $(this).parent().find('div.j').first().toggle();
        })


    })

</script>

</body>
</html>
Ответить с цитированием
  #3 (permalink)  
Старый 19.11.2015, 17:49
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,118


$(function () {
        $('.j').hide();
        $('.c').click(function () {
            $(this).next().toggle();
        })
    })
Ответить с цитированием
  #4 (permalink)  
Старый 24.11.2015, 16:46
Новичок на форуме
Отправить личное сообщение для saper333 Посмотреть профиль Найти все сообщения от saper333
 
Регистрация: 19.11.2015
Сообщений: 9

Большое спасибо за ответы . Но к сожалению примеры немного не те. Нужно чтобы элемент полностью исчезал, как с примером .detach(), а с примером hide() но просто становится невидимым.

Думаю без .detach() в этом выражении не обойтись.

Есть ли ещё какие ни то мысли по этому поводу
Ответить с цитированием
  #5 (permalink)  
Старый 24.11.2015, 16:51
Профессор
Отправить личное сообщение для Mess4me Посмотреть профиль Найти все сообщения от Mess4me
 
Регистрация: 03.11.2014
Сообщений: 263

saper333,
удалялся что ли?
Ответить с цитированием
  #6 (permalink)  
Старый 24.11.2015, 16:55
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,118

saper333,
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <style>
        div {
            border: 1px solid;
        }

    </style>
    <title>Document</title>
    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
</head>
<body>
<div>
    <div class="c">1</div>
    <div class="j" id="m">2</div>
</div>
<div>
    <div class="c">1</div>
    <div class="j">2</div>
    <div class="j">3</div>
    <div class="j">4</div>
</div>
<div>
    <div class="c">1</div>
    <div class="j">2</div>
    <div class="j">4</div>
    <div class="j">3</div>
    <div class="j">7</div>
</div>

<script>
 $(document).ready(function() {
    $(".c").each(function(c, a) {
        var b = $(a).nextAll(".j").remove().eq(0);
        $(a).click(function() {
            $(a).nextAll(".j").length ? b.remove() : b.insertAfter(a)
        })
    })
});
</script>

</body>
</html>

Последний раз редактировалось рони, 24.11.2015 в 19:49.
Ответить с цитированием
  #7 (permalink)  
Старый 24.11.2015, 19:44
Новичок на форуме
Отправить личное сообщение для saper333 Посмотреть профиль Найти все сообщения от saper333
 
Регистрация: 19.11.2015
Сообщений: 9

Огромное спасибо, все работает .
Про такие выражения я даже и не знал .

Всем спасибо что приняли участие в моей проблеме
Ответить с цитированием
  #8 (permalink)  
Старый 24.11.2015, 19:50
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,118

saper333,
чуть сократил ещё
Ответить с цитированием
  #9 (permalink)  
Старый 25.11.2015, 12:26
Новичок на форуме
Отправить личное сообщение для saper333 Посмотреть профиль Найти все сообщения от saper333
 
Регистрация: 19.11.2015
Сообщений: 9

Спасибо =). А не подскажите ещё как сделать отложенную загрузку элементов ajax ?

Последний раз редактировалось saper333, 25.11.2015 в 20:59.
Ответить с цитированием
  #10 (permalink)  
Старый 25.11.2015, 12:31
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,118

Сообщение от saper333
как сделать отложенную загрузку элементов ajax ?
из разряда как сделать сайт, попробуйте уточнить вопрос.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Удаление элементов со страницы jquery savvas Events/DOM/Window 5 03.10.2014 13:23
Фотогалерея на jQuery, сопоставление массива элементов weber jQuery 3 24.10.2013 02:06
Удаление элементов из объекта jQuery glukonator jQuery 2 28.07.2012 22:15
JQuery, анимация для нескольких элементов сразу, возможно ли? Logo jQuery 21 29.05.2012 21:50
jQuery Изменение цвета дочерних элементов libinstyle Общие вопросы Javascript 2 24.03.2010 04:46