Вопрос знающим Javascript

Сообщений: 515 Регистрация: Ноя 2010

11 Октября 2013 22:48

Добрый вечер дамы и господа, нужна ваша помощь.
Добавил спойлер на страницу с помощью яваскрипта, вот его код

Код
<script type="text/javascript"> $(document).ready(function(){ $('.splLink').click(function(){ $(this).parent().children('div.splCont').toggle('normal'); return false; }); }); </script>

Вызываю его этим скриптом

Код
<a href="javscript://" class="splLink">Читать далее</a> <div class="splCont">Скрытый текст</div>

Всё отлично работает, но есть одно но - как сделать что-бы после нажатия "Читать далее" это "Читать далее" пропадало?
И желательно появлялась кнопка "Скрыть" внизу скрытого текста

Изменено: ov3rdoc - 11 Октября 2013 22:51

ov3rdoc

Сообщений: 515 Регистрация: Ноя 2010

12 Октября 2013 02:03

На крайняк просто по повторному нажатию что-бы менялась на слово "скрыть"

ov3rdoc

Сообщений: 515 Регистрация: Ноя 2010

12 Октября 2013 03:53

100 рублей первому, кто предложит лучший вариант:D

Максим Безгодов

Сообщений: 15 Регистрация: Апр 2011

12 Октября 2013 04:13

Я не спец, но, задай "читать далее" ID и в функции просто делай скрытие

Код
<div id="next_1"><a href="javscript://" class="splLink">Читать далее</a></div> <div class="splCont" id="invis_1">Скрытый текст</div>

Код

window.onload = function() {
var next = document.getElementById('next_1');
var invis = document.getElementById('invis_1');
next.onclick = function() {
next.style.display = 'none';
invis.style.display = 'block';
}
}

Изменено: Максим Безгодов - 12 Октября 2013 04:16

ov3rdoc

Сообщений: 515 Регистрация: Ноя 2010

12 Октября 2013 04:30

Максим Безгодов,
заменил скрипт на

Код

    <script type="text/javascript">
window.onload = function() {
var next = document.getElementById('next_1');
var invis = document.getElementById('invis_1');
next.onclick = function() {
next.style.display = 'none';
invis.style.display = 'block';
}
}
</script>

и вывел как вы сказали

Цитата
Максим Безгодов пишет: <div id="next_1">Читать далее</div> <div class="splCont" id="invis_1">Скрытый текст</div>

Запись пропадает, но браузер сразу ругается, вот как это выглядит в 16-ой опере
Рисунок

В ие, скрытый текст открывается, "Читать далее" пропадает и моментально выдаёт это

Рисунок

Может я что-то не так вставил?

failure

Сообщений: 4 Регистрация: Авг 2013

12 Октября 2013 15:27

Код

   <script type="text/javascript">
      $(document).ready(function(){
         $('.splLink').click(function(){
            $(this).parent().children('div.splCont').toggle('normal');
            $(this).fadeOut("fast");
            $('.splLink2').show("fast");
         });
         $('.splLink2').click(function(){
            $(this).parent().children('div.splCont').toggle('normal');
            $(this).fadeOut("fast");
            $('.splLink').show("fast");
         });
      });
   </script> 
   <style>
   .splCont, .splLink2 {
      display:none;
   }
   </style>

HTML

Код
<a href="javscript://" class="splLink">Читать далее</a> <div class="splCont">Скрытый текст</div> <a href="javscript://" class="splLink2">Скрыть</a>

Как то так.

ov3rdoc

Сообщений: 515 Регистрация: Ноя 2010

13 Октября 2013 02:33

failure, Не работает

Coder

Сообщений: 10632 Регистрация: Мар 2013

13 Октября 2013 18:55

Цитата
ov3rdoc пишет: На крайняк просто по повторному нажатию что-бы менялась на слово "скрыть"

Посмотрите, на чистом js:

Код

<div>
<input type="text" style="border:0; color:blue;text-decoration:underline;cursor:pointer" 
value="Развернуть" class="input-button" 
onclick="if (this.parentNode.parentNode
.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') 
{ this.parentNode.parentNode.getElementsByTagName('div')[1]
.getElementsByTagName('div')[0].style.display = ''; 
this.innerText = ''; this.value = 'Свернуть'; 
} else { this.parentNode.parentNode.getElementsByTagName('div')[1]
.getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Развернуть'; }"/>
</div>
<div>
<div style="display: none;">
Скрытый текст
</div>
</div>

✓ Проверенные скрипты и полезности для сайта

✓ Курсы

✓ Сервис временных ссылок

ov3rdoc

Сообщений: 515 Регистрация: Ноя 2010

14 Октября 2013 22:38

Coder, при клике слово развернуть не меняется на свернуть

Coder

Сообщений: 10632 Регистрация: Мар 2013

#10

14 Октября 2013 22:55

Цитата
ov3rdoc пишет: Coder, при клике слово развернуть не меняется на свернуть

Работает: создайте на компьютере файл html, поместите код и запустите:

Код

<html>
<body>
<div>
<input type="text" style="border:0; color:blue;text-decoration:underline;cursor:pointer" 
value="Развернуть" class="input-button" 
onclick="if (this.parentNode.parentNode
.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') 
{ this.parentNode.parentNode.getElementsByTagName('div')[1]
.getElementsByTagName('div')[0].style.display = ''; 
this.innerText = ''; this.value = 'Свернуть'; 
} else { this.parentNode.parentNode.getElementsByTagName('div')[1]
.getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Развернуть'; }"/>
</div>
<div>
<div style="display: none;">
Скрытый текст
</div>
</div>
</body>
</html>

ov3rdoc

Сообщений: 515 Регистрация: Ноя 2010

#11

14 Октября 2013 22:55

200 рублей за рабочий лучший вариант

ov3rdoc

Сообщений: 515 Регистрация: Ноя 2010

#12

14 Октября 2013 22:58

Coder, опера 16 не работает

Coder

Сообщений: 10632 Регистрация: Мар 2013

#13

14 Октября 2013 23:00

Попробовал на:

Код
About Opera Version information Version 12.16 Build 1860 Platform Win32 System Windows XP

Работает

ov3rdoc

Сообщений: 515 Регистрация: Ноя 2010

#14

14 Октября 2013 23:01

Coder, Ну у меня в ie тоже работает

Coder

Сообщений: 10632 Регистрация: Мар 2013

#15

14 Октября 2013 23:07

Цитата
ov3rdoc пишет: Coder, Ну у меня в ie тоже работает

Может, что-то у вас с оперой - может js отключено? Код на чистом js - должен работать везде.

Хром:
Версия 30.0.1599.69 m
Работает

FireFox
24.0
Работает

Safari
5.1.7
Работает

Похожие темы:

12.03.2014 23:09	Прогрузка, важный вопрос
18.11.2011 11:10	Вопрос по меню ipod

Читают тему (гостей: 1, пользователей: 0, из них скрытых: 0)

Новые темы	Объявления	Свободное общение
22:56 "Осталось 5 дн. до НГ" АПдейт Яндекс выдача 22:47 Ссылки с сайтов РБ 22:44 25.12.25 Апдейт Яндекс выдача 22:35 Продвижение-2022: Гугл все? Нет – Гугл не все! 22:33 Дзен окончательно всё? Или у кого-то еще «стреляет» белый контент? 20:16 Волна банов за ПФ под Новый год? Кого еще зацепило? 19:42 Нашел скрины выплат с Сапы за 2010 год. Пошел плакать	18:09 Onechange.me — надежный обменник криптовалют и фиатных средств 16:14 xpoint.pro - быстрый и надежный криптообменный сервис Xpoint 16:05 Продвижение на Авито 14:59 Рассылки СМС/SMS, Вайбер/Viber, Ватсап/Whatsapp, Телеграм/Telegram любой тематики по всему миру 10:06 CryptoGraph — Анонимный обмен криптовалют без KYC и AML 08:53 Размещение статей, ссылок и постовых на качественных ресурсах 08:22 Мониторинг обменников Сrypto-scout.io	22:54 Стряхнуть обыденность - об Агасфере 22:42 Владельцы "китайцев" 3-леток, признавайтесь честно — сгнили или едут? 22:38 Ням-ням! - 8 деликатесов, которые когда-то ели только бедные люди 23:08 Физические сим-карты 22:52 37 противникам прививок от COVID грозят уголовные дела 21:44 С юмором по жизни! 13:34 Компьютерная мышь