|
08.03.2011, 22:29
|
Интересующийся
|
|
Регистрация: 08.03.2011
Сообщений: 11
|
|
"Листание" текста в форме путем нажатия кнопки
Здравствуйте! помогите пожалоста, я в ява скриптах не шарю... есть задумка для сайта.. напишите пожалоста скриптв котором может содержаться несколько текстов, и что при нажатии кнопки которую так же надо написать, в форме вместо текста 1 появлсялся текст 2, если опять нажать, то текст 2 меняется на текст 4 и так далее. Помогите пожалоста
|
|
08.03.2011, 23:21
|
|
Профессор
|
|
Регистрация: 09.11.2009
Сообщений: 1,101
|
|
Ну может как то так можно, набросил за пару мин.
<html>
<head>
<script>
pages = 5;
function listNext(page) {
if (page == 1)
prev_page = pages;
else
prev_page = page-1;
if (page == pages)
next_page = 1;
else
next_page = page+1;
prev_id = "page_"+prev_page;
prev_elem = document.getElementById(prev_id);
prev_elem.style.display = "none";
id = "page_"+page;
elem = document.getElementById(id);
elem.style.display = "block";
document.getElementById('button').innerHTML = '<input type="button" onclick="listNext('+next_page+')" value="Дальше" />';
}
</script>
<style>
.page {
display: none;
}
</style>
</head>
<body>
<div id="page_1">text page 1 text page 1 text page 1 text page 1 </div>
<div id="page_2" class="page">text page 2 text page 2 text page 2 text page 2 </div>
<div id="page_3" class="page">text page 3 text page 3 text page 3 text page 3 </div>
<div id="page_4" class="page">text page 4 text page 4 text page 4 text page 4 </div>
<div id="page_5" class="page">text page 5 text page 5 text page 5 text page 5 </div>
<div id="button"><input type="button" onclick="listNext(2)" value="Дальше" /></div>
</body>
</html>
__________________
"Всегда пишите код так, будто сопровождать его будет склонный к насилию психопат, который знает, где вы живете."
Мой сертификат :-D клацай
|
|
08.03.2011, 23:36
|
Интересующийся
|
|
Регистрация: 08.03.2011
Сообщений: 11
|
|
СПАСИБО БРАТ! Выручил! Я сегодня весь день голову ломал! весь учебник прочитал но ничего непонял! ВЫРУЧИЛ ПРЯМ! СПС ОГРОМНОЕ!
Еще есть маленький вопрос, писать ненадо нече. Просто есть код такой страницы. вот ссыль на эту страницу, код под спойлер не полез. http://svstalker.do.am/14-1-0-1.htm
Там четко написанно что в поле получатель должно стоять Сионист . А как свой текст пихнуть в поле с сообщением? это из системы Юкоз. Я сейчас сохранил файл с кодом страницы в корневой папке сервера. Ннужно только чтоб когда страницу открываешь уже поле с сообщением было заполнено текстом который я введу в шаблоне.
Последний раз редактировалось dikabraz, 08.03.2011 в 23:46.
|
|
08.03.2011, 23:39
|
Интересующийся
|
|
Регистрация: 08.03.2011
Сообщений: 11
|
|
А было бы вапще Щикарно если бы в поле с сообщением стоял тот текст который щас отображается в вашем скрипте))
|
|
01.07.2014, 10:07
|
Новичок на форуме
|
|
Регистрация: 03.08.2013
Сообщений: 5
|
|
Сообщение от walik
|
Ну может как то так можно, набросил за пару мин.
<html>
<head>
<script>
pages = 5;
function listNext(page) {
if (page == 1)
prev_page = pages;
else
prev_page = page-1;
if (page == pages)
next_page = 1;
else
next_page = page+1;
prev_id = "page_"+prev_page;
prev_elem = document.getElementById(prev_id);
prev_elem.style.display = "none";
id = "page_"+page;
elem = document.getElementById(id);
elem.style.display = "block";
document.getElementById('button').innerHTML = '<input type="button" onclick="listNext('+next_page+')" value="Дальше" />';
}
</script>
<style>
.page {
display: none;
}
</style>
</head>
<body>
<div id="page_1">text page 1 text page 1 text page 1 text page 1 </div>
<div id="page_2" class="page">text page 2 text page 2 text page 2 text page 2 </div>
<div id="page_3" class="page">text page 3 text page 3 text page 3 text page 3 </div>
<div id="page_4" class="page">text page 4 text page 4 text page 4 text page 4 </div>
<div id="page_5" class="page">text page 5 text page 5 text page 5 text page 5 </div>
<div id="button"><input type="button" onclick="listNext(2)" value="Дальше" /></div>
</body>
</html>
|
Уважаемый walik
А можно подправить, чтобы была кнопка "Обратно"?
|
|
01.07.2014, 10:14
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
|
|
01.07.2014, 14:13
|
Новичок на форуме
|
|
Регистрация: 03.08.2013
Сообщений: 5
|
|
рони, спасибо!
Возможно ли реализовать ваш скрипт на чистом JS, без jquery?
Причина: страница сделана со скриптами на jquery-1.6.js - в этой версии данный скрип не работает, если оставить только jquery-1.9.1.js, то начинает сбоить уже сделанное содержание.
Последний раз редактировалось BFAll, 01.07.2014 в 14:33.
|
|
01.07.2014, 15:55
|
|
Профессор
|
|
Регистрация: 27.05.2010
Сообщений: 33,109
|
|
BFAll,
для версии 1.6
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>selectable demo</title>
<script src="http://code.jquery.com/jquery-1.6.js"></script>
<style>
p{ display: none; }
.selected { display: block; }
</style>
<script>
$(document).ready(function()
{
var p = $("p");
p.first().addClass("selected");
$(document).delegate( ".next, .prev", "click", function(event)
{
event.preventDefault();
var selected = $(".selected");
selected.removeClass("selected");
if($(this).hasClass("next") ) {
selected = selected.next('p').size()? selected.next():p.first() ;
}
else {
selected = selected.prev('p').size()? selected.prev():p.last();
}
selected.addClass("selected");
}
)
}
);
</script>
</head>
<body>
<a href="" class="prev">prev</a> <a href="" class="next">next</a>
<p>1</p><p>2</p><p>3</p>
</body>
</html>
|
|
01.07.2014, 21:09
|
Новичок на форуме
|
|
Регистрация: 03.08.2013
Сообщений: 5
|
|
рони, спасибо!
|
|
25.02.2015, 13:34
|
Аспирант
|
|
Регистрация: 25.02.2015
Сообщений: 41
|
|
Помогите улучшить данный скрипт.
Как сделать так чтоб позиция сохранялась при закрытии и открытии браузера. То есть дошел до 3 закрыл, и открыл на 3.
|
|
|
|