Вопрос знающим 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

Сообщений: 10187 Регистрация: Мар 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

Сообщений: 10187 Регистрация: Мар 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

Сообщений: 10187 Регистрация: Мар 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

Сообщений: 10187 Регистрация: Мар 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)

Новые темы	Объявления	Свободное общение
21:55 Webvork - международная товарная СРА сеть с сертифицированными офферами на Европу. 14:10 3snet - гемблинг, беттинг, форекс, бинарные опционы, майнинг 11:52 Партнерская программа Xoffers с прямыми офферами в вертикалях форекс, крипта и бинарные опционы. 22:22 DreamCash.tl - заработок на онлайн-видео. До 95% отчислений, отличный конверт! 20:00 Самозанятые смогут зарабатывать в рекламной сети VK 19:24 XEvil - софт для разгадывания капчи. Бесплатная демо-версия. Привязка к SEO/SMM-софту. 18:02 SharkBoss - партнёрская программа для монетизации ЛЮБЫХ видов трафика (включая спам).	22:58 Продам обменник криптовалюты, а также новый обменник под ключ с обучением. Скидки на скрипты обменника 17:22 Coin Click.cc - Быстрый и надежный обмен электронных валют в два клика 14:44 Восстановление сайтов из Вебархива на Wordpress 12:01 BestChange – обменивать электронную валюту можно быстро и выгодно 20:59 Продам базу данных Банки/физы/миксы/БАДы 20:23 ⭐Прием любых платежей для HIGH RISK проектов⭐ 18:14 A-Parser 1.1 - продвинутый парсер поисковых систем, Suggest, PR, DMOZ, Whois, etc	21:27 Точные прогнозы на футбол 15:43 Заказать телефонный флуд. 12:05 Ням-ням! - 8 деликатесов, которые когда-то ели только бедные люди 11:25 Флуд звонками 11:40 Кто сделает прогон для адалт сайта? 09:25 Добро пожаловать в цифровой мир... 10:31 Видимо, похороны СУПРа уже прошли как-то по-тихому