Форум SAPE.RU

Форум SAPE.RU (http://forum.sape.ru/index.php)
-   Разработка и сопровождение сайтов (http://forum.sape.ru/forumdisplay.php?f=29)
-   -   Подскажите, на чём реализовать? (http://forum.sape.ru/showthread.php?t=23127)

Русская мафия 28.11.2008 22:57

Подскажите, на чём реализовать?
 
Необходимо сделать, чтобы при клике на кнопку появлялась надпись под кнопкой из массива. Думал на джава скрипт, но с ним в коде страницы виден сам скрипт, а мне нужно чтобы он был скрыт. Как лучше поступить? Надпись должна выводится на этой же странице, т.е. чтобы страница не перезагружалась. Спасибо.

maksim7 28.11.2008 22:59

AJAX?
Масив с БД?

Русская мафия 28.11.2008 23:00

Массив со скрипта, бд не нужно.

maksim7 28.11.2008 23:07

AJAX ключевое слово, есть неплохая библиотека на _dklab.ru
Вы сможете подгружать данные с сервера в браузер без перезагрузки. Больше сказать тяжело поскольку неясна задача

Русская мафия 28.11.2008 23:12

Цитата:

Сообщение от maksim7 (Сообщение 322013)
Больше сказать тяжело поскольку неясна задача

Задача следующая: в скрипте указываем массив из строк текста. На странице есть кнопка (<Input type="Button" value="Надави на меня" onClick="MyFunc()">) . При нажатии на кнопку должна появится надпись на этой же странице, взятая рандомно из массива. При этом страница не должна перезагружаться. И скрипт этот в исходном коде страницы не должен быть виден.

maksim7 28.11.2008 23:27

Ну тогда ответ выше.
Масив хранится на сервере в скрипте php например (serv_script.php), посылаете запрос с помощью AJAX который обращается к этому serv_script.php и возвращает рендомный элемент масива.
Вот ссылочка на библиотеку о которой я говорил _http://dklab.ru/lib/JsHttpRequest/
Там есть примеры.

Русская мафия 28.11.2008 23:30

maksim7, Спасибо, надеюсь разберусь=)

kaxart 29.11.2008 00:18

а почему нельзя перезагрузить страницу? долго загружается?

ahsinis 29.11.2008 09:14

Цитата:

Сообщение от maksim7 (Сообщение 322013)
AJAX ключевое слово, есть неплохая библиотека на _dklab.ru

Писец, ну нахрена тянуть тяжелую либу, когда это можно сделать в 20 строчках кода. Люди совсем уже обленились, на xаммере в булочную через дорогу ездят уже. :D

Добавлено через 11 минут
Повешайте на клик кнопки обработчик DoWork
Код:

function DoWork() {
        var loader = GetAJAXLoader();
        if(loader===null) return;
        loader.onreadystatechange = function(){
                try {
                        if (loader.readyState == 4) {
                                if (loader.status == 200) {
                                        document.getElementById('ID_html_элемента_для_замены_контента').innerHTML = loader.responseText;
                                }
                        }
                }
                catch( e ) {
                }
        }
        loader.open("GET", 'URL_на_сервере_для_получения_нового_контента', true);
        loader.send(null);
        return ;
}
function GetAJAXLoader(){
        var req=null;
          if (typeof(window.XMLHttpRequest)!='undefined') { try { req = new XMLHttpRequest(); } catch (e){ alert("Ошибка при получении AJAX загрузчика"); } }
          else if (typeof(window.ActiveXObject)!='undefined') {
              try { req = new ActiveXObject('Msxml2.XMLHTTP');} catch (e){
            try { req = new ActiveXObject('Microsoft.XMLHTTP'); } catch (e){ alert("Ошибка при получении AJAX загрузчика"); }
                }
        }
        else alert("Браузер не поддерживает AJAX");
        return req;
}

и включите на сервере в скрипт заголовок с нужной кодировкой
header("Content-type: text/plain; charset=windows-1251");

Pepel 29.11.2008 12:05

Цитата:

Писец, ну нахрена тянуть тяжелую либу, когда это можно сделать в 20 строчках кода. Люди совсем уже обленились, на xаммере в булочную через дорогу ездят уже.
Тож хотел примерчик написать, но вы меня опередили))).

Добавлено через 44 минуты
Вот мой пример:
Код:

<html>
  <body>
    <form>
      <input type="button" value="Надави на меня" onClick="MyFunc()">
      <div id="div_letter"></div>
    </form>
    <script type="text/javascript"><!--
        var request = null;
       
        function MyFunc(){
            if (request == null){
                request = CreateRequest();
                SendRequest(request, 'ajax_letter.php', UpdatePage);
            }
        }
       
        function UpdatePage(){
            if (request.readyState == 4 && request.status == 200){
                document.getElementById('div_letter').innerHTML = request.responseText;
                request = null;
            }
        }

        function CreateRequest(){
            var request;
            try{
                request = new XMLHttpRequest();
            }catch (trymicrosoft){
                try{
                    request = new ActiveXObject('Msxml2.XMLHTTP');
                }catch (othermicrosoft){
                    try{
                        request = new ActiveXObject('Microsoft.XMLHTTP');
                    }catch (failed){
                        request = false;
                    }
                }
            }
   
            if (!request)
                alert('Вы используете устаревший или неработоспособный браузер. Некоторые возможности на этой странице вам будут недоступны. Попробуйте использовать другой браузер или другой компьютер.');
   
            return request;
        }

        function SendRequest(request, url, func){
            request.open('GET', url, true);
            request.onreadystatechange = func;
            request.send(null);
        }
    //--></script>
  </body>
</html>

Файл ajax_letter.php в том же каталоге:
Код:

<?php
    header('Content-Type: text/plain; charset=windows-1251');
   
    $data = array('Текст 1', 'Текст 2', 'Ещё один текст', 'И так далее');
    echo $data[rand(0, count($data) - 1)];
?>

Посмотреть как работает можно здесь: http://www.przone.ru/ajax/letter.html
Скачать отсюда: http://www.przone.ru/ajax/ajax_letter.zip


Часовой пояс GMT +3, время: 04:24.

Работает на vBulletin® версия 3.8.7.
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Перевод: zCarot
SAPE.RU — система купли-продажи ссылок с главных и внутренних страниц сайтов.