С нами с 15.06.10
Сообщения: 1721
Рейтинг: 52
|
 Добавлено: 27/01/19 в 22:53 |
уже битый час кручу верчу и не работает.
вот пример кода
https://codepen.io/anon/pen/mENwdY
вот
это пишу в хтпмл
| Код: [развернуть] |
<head>
</head>
<body>
<script type="text/javascript"> //разворачиваем/сворачиваем отзыв
$('#button').on('click', function(e) {
$('#block').slideToggle(function() {
$(e.target).text($(this).is(':visible') ? 'Меньше' : 'Больше');
});
});
</script>
<div id="block" style="display: none;">Содержимое</div>
<div id="button">Больше</div>
<style>
#button {
cursor: pointer;
}
</style>
</body>
</html> |
и не работает
что я упускаю?
|
|
|
|
| |
С нами с 15.06.10
Сообщения: 1721
Рейтинг: 52
|
| Добавлено: 28/01/19 в 00:20 |
я думаю что не запускается сам джава скрипт.
почему?
|
|
|
|
| |
С нами с 20.06.10
Сообщения: 171
Рейтинг: 445
|
| Добавлено: 28/01/19 в 03:27 |
вот так в <head> вставь
| Код: [развернуть] | <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script>
$(function() {
$('#button').on('click', function(e) {
$('#block').slideToggle(function() {
console.log($(e.target).is(':visible'));
$(e.target).text($(this).is(':visible') ? 'Меньше' : 'Больше');
});
});
});
</script> |
|
|
|
|
| |
С нами с 11.11.11
Сообщения: 507
Рейтинг: 171
|
| Добавлено: 28/01/19 в 11:39 |
еще вариант на jquery
| Код: [развернуть] |
<a href="#" onclick="$('.spoiler').toggle();return false;">Подробнее...</a>
<div class="spoiler" style="display: none;">Скрытый текст</div>
|
|
|
|
|
| |
С нами с 18.04.15
Сообщения: 100
Рейтинг: 138
|
| Добавлено: 28/01/19 в 12:24 |
Ты вешаешь обработчик на кнопку, которой в момент вызова скрипта не существует.
Либо оберни скрипт в $(document).ready(function() { ТУТ_СКРИПТ });
Пример:
| Код: | <script type="text/javascript"> //разворачиваем/сворачиваем отзыв
$(document).ready(function() {
$('#button').on('click', function(e) {
$('#block').slideToggle(function() {
$(e.target).text($(this).is(':visible') ? 'Меньше' : 'Больше');
});
});
});
</script> |
Либо поставь скрипт ниже элементов.
|
|
|
|
| |
+ + +
С нами с 12.06.17
Сообщения: 45
Рейтинг: -158
|
| Добавлено: 29/01/19 в 17:57 |
| cherchell2010 писал: | уже битый час кручу верчу и не работает.
вот пример кода
https://codepen.io/anon/pen/mENwdY
вот
это пишу в хтпмл
| Код: [развернуть] |
<head>
</head>
<body>
<script type="text/javascript"> //разворачиваем/сворачиваем отзыв
$('#button').on('click', function(e) {
$('#block').slideToggle(function() {
$(e.target).text($(this).is(':visible') ? 'Меньше' : 'Больше');
});
});
</script>
<div id="block" style="display: none;">Содержимое</div>
<div id="button">Больше</div>
<style>
#button {
cursor: pointer;
}
</style>
</body>
</html> |
и не работает
что я упускаю? |
Вы упускаете тот факт, что на сайте примера, уже подключен jquery, а у вас нет. И поэтому у вас не отрабатывало.
<head>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
</head>
вот это добавите и все отработает.
Далее. Посоветовал бы вам пройти минимальный курс по jQuery очень полезно на будущее..
https://www.youtube.com/watch?v=0sjmobLgzoI
|
|
|
|
| |
С нами с 20.06.10
Сообщения: 171
Рейтинг: 445
|
| Добавлено: 29/01/19 в 20:51 |
| phpdev2017 писал: | Вы упускаете тот факт, что на сайте примера, уже подключен jquery, а у вас нет. И поэтому у вас не отрабатывало.
<head>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
</head>
вот это добавите и все отработает.
|
если подключить просто jquery, то не отработает. У него ошибка в коде изначально
он забыл добавить в начале
ну и инклюд само собой нужен с jquery
|
|
|
|
| |
Текстовая реклама в форме ответа
Заголовок и до четырех строчек текста
Длина текста до 350 символов
Купить рекламу в этом месте! |
