Форум Сайтостроение Веб-строительство

Простенький вопрос, помогите, плиз, знатоки html и js

regta
На сайте с 15.04.2006
Offline
320
regta
725

Здравствуйте!

Вот такая вот ситуация:

Есть страница (гипотетически) достаточно тяжелая (графика, скрипты и т.п.)

И нужно сделать пароль к этой странице (самый простой, который только может быть)

Идея в чем - человек заходит на эту страницу, условно: site.ru/page.htm

Первое что он видит - форма ввода пароля. Пока он соображает что делать, пока вводит пароль, пока жмет на кнопку - в это время идет загрузка страницы.

Как только он ввел пароль - форма исчезает и сразу появляется то что уже загружено (или все или то что успело загрузится)

Мысль такая - два div'а - в первом (видимом) - сама форма пароля, во втором (display:none) - собственно и идет загрузка основного содержимого.

<div id="v1" style="display:block"> - это для пароля

<div id="v2" style="display:none"> - здесь загрузка содержимого

Как только чел ввел пароль - div-ы сразу "меняются" стилями

document.getElementById('v2').style.display='block'

document.getElementById('v1').style.display='none'

Вот нужна реализация - как это сделать?

Т.е. ввел пароль - жмакнул ОК - произошло событие

Обратной "смены" не требуется.

Проверка на правильность пароля - самая простая. Вполне достаточно правильный ответ подгрузить незаметно сразу со страницей. Или в каком-нибудь js-файле извне заинклюдить. Пароль простой - набор мелких латинских букв.

------------------

Заранее большое спасибо!

Цитируйте, плиз, историю переписки в личке. Спасибо.
minor
На сайте с 04.10.2010
Offline
70
minor
#1

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

Есть страница (гипотетически) достаточно тяжелая (графика, скрипты и т.п.)

Лучше постараться её оптимизировать, я думаю можно добиться большего.

PHP experience 2 year, comprehend seo
оптимизация сайта до добавления Свершилось: при ранжировании Google кражи паролей и логинов
[Удален]
#2

повесить в событие на отправку формы ещё и

document.getElementById('v2').style.display='block'
document.getElementById('v1').style.display='none'
regta
На сайте с 15.04.2006
Offline
320
regta
#3

minor, вы правы. Но в данном случае - пароль это формальность. Защита от дурака, скажем так.

[Удален]
#4

55559939 - Могу помочь со скриптом

regta
На сайте с 15.04.2006
Offline
320
regta
#5
burunduk:
повесить в событие на отправку формы ещё

хм.... А вот так будет работать? Или это нерабочая схема?

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!--

function Proverka()

{

var protv="qwerty";

if(Pass.pwrd.value != protv)

alert("Ошибка при вводе пароля\nПопробуйте еще раз");

else

{

document.getElementById('v2').style.display='block'

document.getElementById('v1').style.display='none'

document.forms[0].submit();

}

}

// -->

</SCRIPT>

</HEAD>

<BODY>

<div id="v1" style="display:block">

<FORM METHOD=POST NAME="Pass" ACTION="http://site.ru/page.htm">

<TABLE>

<TR><TD><B>Пароль:</B></TD><TD><INPUT TYPE="password" NAME="pwrd" SIZE="20"></TD></TR>

<TR><TD><INPUT TYPE="button" VALUE="Go" onClick="Proverka();"></TD></TR>

</TABLE>

</FORM>

</div>

<div id="v2" style="display:none">

<!-- основной контент -->

</div>

</body>

</html>

редирикт Проблема с html формами Два атрибута NAME одной
php.developer
На сайте с 22.11.2010
Offline
94
php.developer
#6
regta:
хм.... А вот так будет работать? Или это нерабочая схема?

<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function Proverka()
{
var protv="qwerty";
if(Pass.pwrd.value != protv)
alert("Ошибка при вводе пароля\nПопробуйте еще раз");
else
{
document.getElementById('v2').style.display='block'
document.getElementById('v1').style.display='none'
document.forms[0].submit();
}
}
// -->
</SCRIPT>
</HEAD>
<BODY>

<div id="v1" style="display:block">

<FORM METHOD=POST NAME="Pass" onsubmit="Proverka();" ACTION="http://site.ru/page.htm">
<TABLE>
<TR><TD><B>Пароль:</B></TD><TD><INPUT TYPE="password" NAME="pwrd" SIZE="20"></TD></TR>
<TR><TD><INPUT TYPE="button" VALUE="Go"></TD></TR>
</TABLE>
</FORM>

</div>

<div id="v2" style="display:none">

<!-- основной контент -->

</div>

</body>
</html>

Тогда вот так лучше.

[Удален]
#7
regta:
А вот так будет работать? Или это нерабочая схема?

по идеи да,

только кажется вот это лишнее

ACTION="http://site.ru/page.htm"

и нужно добавить return false

minor
На сайте с 04.10.2010
Offline
70
minor
#8

Есть минус display:none не влияет на загрузку страници, даже если контент спрятан он все равно будет загружатся. Если в скрытом диве данные с сервера берутся, то есть смысл получать их через аякс это зарузит основную страницу а скрытый див будет в "фоновом" загружатся. Так же лучше использовать Jquery, все будет намного проше.

На загрузку страницы влияет хостинг (мошность процессора), по возможности нужно найти хостинг с поддержкой eaccelerator, mod_deflate, mod_expires. Так же изображение обработать в фотошопе если они весомые и много чего еше можно сделать=).

Как обойти Адблок? Переспам скрытыми ключами Яндекс и скрытая аяксом
autocalc
На сайте с 11.05.2011
Offline
52
autocalc
#9

Это защита от дураков. Скрытую информацию нужно грузить только после проверки пароля. А там, каким способом (POST, Ajax), уже не важно. А костыль с display:none рушится нажатием двух клавиш - Ctrl + U.

Скрыть текст Ссылки в меню в Вопрос про dispaly: none
CrePashOk
На сайте с 12.10.2011
Offline
21
CrePashOk
#10

function show_form(){

$("#popup").show();

$("#fog").show();

}

function hide_content(){

$(".wrap").hide();

}

$(document).load(function(){

show_form();

hide_content();

});

$(document).ready(function(){

//Функция проверки пароля и вывода контента

})

Полный спектр услуг по WordPress (http://www.wpteam.net). icq: 55559939, skype: crepashok, portfolio: wpteam (http://www.wpteam.net/portfolio)

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий