Отключенный JavaScript

HTML, CSS, DOM, XML, AJAX, (LW)AMP и т.д. CMS и веб-форумы, веб-дизайн и веб-программирование, специализированные языки и технологии.

Модератор: xdsl

Отключенный JavaScript

Сообщение TORES 08 апр 2011, 23:24

При разработке веб-сайта столкнулся с проблемой. Я сделал форму авторизаций на JavaScript.
Код: Выделить всё
<img src="Files/images/key.gif"> &nbsp <a href="#" onclick="showLoginWindow(); return false">Вход</a>
/ <a href="Files/registration.html"> Регистрация</a>
         <!--    FORMA AVTORIZATION   -->

<div id="login">
  <span class="close" onclick="hideLoginWindow(); return false;">x</span>
 

      <center>
<FORM action="" method="POST">
   <B>Авторизация</B>
   <table border="0">
      
      <tr> 
            <td>
                  Логин:
           </td>
           <td>
                 <INPUT type="text" name="lgn" width="144px"> 
              </td>
      </tr>
      <tr>
           <td>
              Пароль:
             </td>
          <td class="autho_ie">
              <INPUT type="password" name="pswd" width="144px"> 
          </td>
      </tr>
          
      <tr>
           <td colspan="2" align="middle">
              <div class="submit"> <INPUT type="submit" name="enter" value="Вход"> </div>
                      <a href="#" >Регистрация</a>       
           </td>
      </tr>
   </table>
         
   
</FORM>
         </div>       </center>      
         


При клике на ВХОД выпадает окно авторизаций на JavaScript. Проблема в том если JavaScript отключен в браузере, пользователю необходимо отобразить форму авторизаций на странице! Я не хочу делать просто сообщение <noscript> TEXT </noscript> об отключенном скрипте! Что в этой ситуаций делать?????
TORES
 
Сообщения: 16
Зарегистрирован: 14 май 2009, 10:29
Полное имя: Морозов Александр Павлович

Re: Отключенный JavaScript

Сообщение xdsl 10 апр 2011, 22:11

Форма входа в примере появляется безотносительно к включенному или отключенному javascript. Реализаций showLoginWindow() и hideLoginWindow() в коде нет, поэтому в понимании вопроса может помочь только телепатия. Так, где мой штатный мелафон?... ага - вот он, лишь бы батарейки не сели ... Пробуем:

Телепатический вариант №1: где-то выше приведенного участка кода определен CSS-стиль на id=login с атрибутом display=none, например так:
Подсветка синтаксиса: (telepat1.css) [ Загрузить ] [ Скрыть ]
Подсветка синтаксиса языка css
<STYLE type="text/css">
div#login { display: none }
</STYLE>
а функции showLoginWindow() и hideLoginWindow() определены так:
Подсветка синтаксиса: (telepat1.js) [ Загрузить ] [ Скрыть ]
Подсветка синтаксиса языка javascript
<script>
function showLoginWindow()
 { document.getElementById("login").style.display="block"; }
function hideLoginWindow()
 { document.getElementById("login").style.display="none"; }
</script>
Я прав в своем экстрасенсорном озарении? Если да, то этот код можно модифицировать для работы в безскриптовых браузерах. Если нет, то хотелось-бы увидеть полную версию веб-страницы, для адекватной оценки проблемы.
xdsl
 
Сообщения: 1236
Зарегистрирован: 09 дек 2008, 05:16
Откуда: ВЦ ШГПИ
Полное имя: Слинкин Д.А.

Re: Отключенный JavaScript

Сообщение TORES 11 апр 2011, 22:54

Вариант написанный вами, показался мне более простым чем сделано у меня. Вы полностью уловили мою мысль, но у меня сделано в другом ключе, используя координаты, форма авторизации находится за областью, которую видит пользователь!!
CSS код:
Код: Выделить всё
   
/* FORMA AUTORIZATION */

#login {
   position: absolute;
   right: 40px;
   top: -160px;
   line-height:18px;
   width: 250px;
   height:120px;
   background: url(images/login-win-shadow.png) center bottom repeat-x;
   border-bottom: none;
   z-index: 40;
   border:1px solid #333333;
}
#login .close {
   position: absolute;
   right: 3px;
   top: 5px;
   width: 11px;
   height: 11px;
   text-indent: 20px;
   overflow: hidden;
   background: url(../images/close.gif) no-repeat;
}
#login form {
   margin: 0 0 2px 0px;
   padding: 16px 12px 10px 12px;
   /*border: 1px solid #E1E1EB;*/
   background: #F4F5FA;
   overflow: hidden;
   
   }
#login input {
   float: right;
   margin:3px 2px 2px 0;
}



JavaScript код:

Код: Выделить всё

<script text="javascript">
.........................

function tfblur(tf) {
   tf.className = 'inactive';
}

var lwNewY = 0;
var logWinHandler = null;
var lwElement;

function showLoginWindow() {
   lwNewY = 0;
   setLoginWindowAnimHandler();
}

function hideLoginWindow() {
   lwNewY = -160;
   setLoginWindowAnimHandler();
}

function loginWindowAnimation() {
   var y = lwElement.offsetTop;
   y = Math.round((y * 2 + lwNewY) / 3);
   lwElement.style.top = y + 'px';
   if (y == lwNewY) {
      clearInterval(logWinHandler);
   }
}

.................................
</script>


А в целом идею вы мою уловили!!!!Если в браузерах скрипты отключены, то необходимо выводить форму на отдельную веб-страницу!!!!!!
TORES
 
Сообщения: 16
Зарегистрирован: 14 май 2009, 10:29
Полное имя: Морозов Александр Павлович

Re: Отключенный JavaScript

Сообщение Vladislav_133 12 апр 2011, 09:58

Вариант xdsl прост и очевиден. Ничего больше и не надо.
Аватара пользователя
Vladislav_133
Elite
 
Сообщения: 1386
Зарегистрирован: 13 дек 2008, 18:08
Полное имя: П.В.Ю.

Re: Отключенный JavaScript

Сообщение xdsl 12 апр 2011, 10:29

Не очень хороший вариант - сдвигать элементы в минуса за пределы видимости. Во первых - кто сказал, что браузер это разрешит? Во вторых - кто сказал, что у браузера текущий порт просмотра начинается от координат (0,0)? Конечно, каждый решает для себя сам, но вот рабочий вариант, который-бы использовал я в такой ситуации:
Подсветка синтаксиса: (js_or_not_js.html) [ Загрузить ] [ Скрыть ]
Подсветка синтаксиса языка javascript
<script>
function showLoginWindow()
 {
  document.getElementById("login").style.display="block";
  var hs=document.getElementById("hideshow");
  hs.innerHTML="Hide";
  hs.onclick=hideLoginWindow;
 }
function hideLoginWindow()
 {
   document.getElementById("login").style.display="none";
   var hs=document.getElementById("hideshow");
   hs.innerHTML="Enter";
   hs.onclick=showLoginWindow;
   hs.style.display="block";
  }
</script>
<body onload="hideLoginWindow()">
<a href="Files/registration.html"> Register</a>
<div>

<a style="display: none" id="hideshow" href="#" onclick="showLoginWindow()">Enter</a>

<div id="login">

<FORM action="" method="POST">
  Login: <INPUT type="text" name="lgn"><br>
  Password: <INPUT type="password" name="pswd"> <br>
  <INPUT type="submit" name="enter" value="Enter">
 </FORM>
</div>

</div>
</body>

Корректно работает и при включенном и отключенном javascript
xdsl
 
Сообщения: 1236
Зарегистрирован: 09 дек 2008, 05:16
Откуда: ВЦ ШГПИ
Полное имя: Слинкин Д.А.

Re: Отключенный JavaScript

Сообщение TORES 12 апр 2011, 11:39

БОЛЬШОЕ СПАСИБО ЗА ПРЕДЛОЖЕННЫЙ ВАРИАНТ!!!!!!!!!!!! Учту свой ошибки!!!
TORES
 
Сообщения: 16
Зарегистрирован: 14 май 2009, 10:29
Полное имя: Морозов Александр Павлович

Re: Отключенный JavaScript

Сообщение xdsl 12 апр 2011, 23:54

Завсегда пожалуйста ;)
xdsl
 
Сообщения: 1236
Зарегистрирован: 09 дек 2008, 05:16
Откуда: ВЦ ШГПИ
Полное имя: Слинкин Д.А.

Re: Отключенный JavaScript

Сообщение arengin 22 мар 2013, 01:51

Тема вижу старая, но решил таки отписаться. Я обычно в таких случаях использую такой вариант:
Считаю что лучше сделать отдельную страницу входа для отключенного js. Если js включен, то соответственно выполнять скрипт с прерыванием перехода на страницу авторизации + указанную функцию можно использовать и для других блоков сайта в данных целях.
Код: Выделить всё
<script>
function hidden_form(id_div){
div=document.getElementById(id_div);
if(div.style.display == "none") div.style.display = "block";
else div.style.display = "none"
}
</script>
<a href="login.php" onclick="hidden_form('loginform');return false;">Вход</a>
<div id="loginform" style="display:none;"> тут форма входа </div>
Аватара пользователя
arengin
 
Сообщения: 6
Зарегистрирован: 24 сен 2009, 07:37
Откуда: Курьер Плюс
Полное имя: Ренжин А.В.


Вернуться в Web-технологии

Кто сейчас на конференции

Сейчас этот форум просматривают: нет зарегистрированных пользователей и гости: 2