Создание, раскрутка, оптимизация сайтов.
Купи, продай свое железо!


Здравствуйте Гость ( Вход | Регистрация )

  Ответить · Новая Тема ·Создать опрос

> ScriptJava Framework - документация и примеры, примеры на scriptjava
nmnm
  Дата: 7.02.2012 - 17:32
Offline



Новичок
*

Профиль
Группа: Пользователи
Сообщений: 8
Пользователь №: 9669
Регистрация: 13.05.2011



ScriptJava Framework - $$().$$().$$().$$().$$()...

ScriptJava это JavaScript Framework, который создан для облегчения разработки динамических веб-приложений.

ScriptJava Framework

* работа с элементами
* работа с ajax
* динамическая подгрузка скриптов
* динамическое создание элементов
* динамическая подгрузка css стилей
* отправка файлов через ajax
* отправка формы через ajax
* работа с cookie
* работа с событиями
* работа с браузером, экраном, числами, элементами

Подробный мануал на русском
http://scriptjava.net/

Поддерживает все современные браузеры!

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

Код

$$() - получение доступа к элементам
$$a() - работа с ajax
$$c() - работа с cookie
$$e() - работа с событиями
$$f() - отправка форм через ajax
$$i() - динамическое подключение скриптов стилей и создание элементов
$$r() - работа с событием window.onload
$$s() - набор полезных функций по работе с экраном, мышью, браузером, элементами, числами и т.д.


Код

$$()
$$a() - ajax
$$c() - cookie
$$e() - event
$$f() - forms
$$i() - insert
$$r() - ready
$$s() - scripts


Примеры на scriptjava:

Отправка файла через AJAX

Вначале нужно подключить сам scriptjava фреймворк

Код

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>


Для отправки файлов серверу есть такая форма

Код

<form id="test_form" method="post" enctype="multipart/form-data">
<input type="file" name="upload_file" />
</form><br /><br />
<div id="status">Тут будет статус загрузки</div><br /><br />
<div onclick="SendFile();">Отправить файл через Ajax</div><br />


Пишем для него функцию отправки

Код

<script type="text/javascript">
function SendFile() {
    $$f({
        formid:'test_form',//id формы
        url:'ajax.php',//адрес на серверный скрипт который будет принимать файл
        onstart:function () {//действие при начале отправки файла на сервер
            $$('status','начинаю отправку файла');
        },
        onsend:function () {//действие по окончании отправки файла на сервер
            $$('status',$$('status').innerHTML+'<br />файл успешно загружен');
        }
    });
}
</script>


Чтобы получить ответ от сервера, содержимое файла ajax.php может быть таким:

Код

<?php
    if($_FILES['upload_file']['size']>0) {
        echo '
            <script type="text/javascript">
            var elm=parent.window.document.getElementById("status");
            elm.innerHTML=elm.innerHTML+"<br />Получен файл '.$_FILES['upload_file']['name'].' размером '.$_FILES['upload_file']['size'].' байт";
            </script>
        ';
    }
?>


Работа с cookies

Вначале нужно подключить сам scriptjava фреймворк

Код

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>


Для проверки поддерживает и браузер кукисы можно использовать следующий код:

Код

<script type="text/javascript">
//проверяю поддержку cookie браузером
if($$c.test()) {
    alert('браузер поддерживает cookie');
}
else {
    alert('браузер не поддерживает cookie');
}
</script>


Вот так можно установить кукисы на 10 секунд

Код

<script type="text/javascript">
//устанавливаю cookie
$$c.set('test', 'содержимое test', 10);
</script>


Вот так можно считать кукисы

Код

<script type="text/javascript">
//читаю cookie
alert($$c.get('test'));
</script>


Для удаления установленных кукисов достаточно использовать такой код

Код

<script type="text/javascript">
//удаляю cookie
$$c.erase('test');
</script>


Отправка формы через Ajax.

Вначале нужно подключить сам scriptjava фреймворк

Код

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>


Допустим на странице сайта у нас есть форма

Код

<form id="test_form" action="comment.php" method="post">
    Имя: <input type="text" name="name" /><br />
    Комментарий: <textarea name="comment"></textarea>
</form><br />
<div id="result">Тут будет статус загрузки</div><br /><br />
<div onclick="SendForm();">Отправить форму через Ajax</div><br />


Ее можно отправить на сервер через AJAX с помощью кода

Код

<script type="text/javascript">
function SendForm() {
    //отправка файла на сервер
    $$f({
        formid:'test_form',//id формы
        url:'comment.php',//адрес на серверный скрипт, такой же как и в форме
        onstart:function () {//действие при начале отправки
            $$('result','начинаю отправку');//в элемент с id="result" выводим результат
        },
        onsend:function () {//действие по окончании отправки
            $$('result',$$('result').innerHTML+'<br />комментарий успешно отправлен');//в элемент с id="result" выводим результат
        }
    });
}
</script>


Чтобы получить ответ от сервера, содержимое файла comment.php может быть таким:

Код

<?php
if(isset($_POST['name'])) {
    echo'
        <script type="text/javascript">
        var elm=parent.window.document.getElementById("result");
        elm.innerHTML=elm.innerHTML+"<br />Получено имя '.str_replace("\r","",str_replace("\n","<br />",htmlspecialchars(stripslashes($_POST['name'])))).' с текстом '.str_replace("\r","",str_replace("\n","<br />",htmlspecialchars(stripslashes($_POST['comment'])))).' ";
        </script>
    ';
}
?>


Динамическое подключение скриптов

Вначале нужно подключить сам scriptjava фреймворк

Код

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>


Чтобы динамически подключить скрипт, а также после его загрузки выполнить из него код, нужно выпонить следующий код

Код

<script type="text/javascript">
function GetScript() {
    //Подключаю внешний скрипт и запускаю из него метод
    $$i({
        create:'script',
        attribute: {
            'type':'text/javascript',
            'src':'http://nagon.net/js/NRMSLib.js'//адрес на подключаемый скрипт
        },
        insert:$$().body,
        onready:function() {
            modules.sound.start();//этот метод запускается уже из подключенного скрипта
        }
    });
}
GetScript();
</script>


Дописываю вышепоказанный код, теперь он будет запускаться сразу после загрузки сайта:

Код

<script type="text/javascript">
//выполнение кода только после загрузки документа
$$r(function() {
    //Подключаю внешний скрипт и запускаю из него метод
    $$i({
        create:'script',
        attribute: {
            'type':'text/javascript',
            'src':'http://nagon.net/js/NRMSLib.js'//адрес на подключаемый скрипт
        },
        insert:$$().body,
        onready:function() {
            modules.sound.start();//этот метод запускается уже из подключенного скрипта
        }
    });
 
});
</script>


Отправка GET, POST, HEAD запросов через AJAX

Вначале нужно подключить сам scriptjava фреймворк

Код

<script type="text/javascript" src="http://scriptjava.net/source/scriptjava/scriptjava.js"></script>


Поместим на сайт такой html код

Код

<div id="result">Тут будет ответ от сервера</div><br /><br />
<div onclick="SendGet();">Отправить GET запрос через Ajax</div><br />
<div onclick="SendPost();">Отправить POST запрос через Ajax</div><br />
<div onclick="SendHead();">Отправить HEAD запрос через Ajax</div><br />


Пишем код

Код

<script type="text/javascript">
function SendGet() {
    //отправляю GET запрос и получаю ответ
    $$a({
        type:'get',//тип запроса: get,post либо head
        url:'ajax.php',//url адрес файла обработчика
        data:{'q':'1'},//параметры запроса
        response:'text',//тип возвращаемого ответа text либо xml
        success:function (data) {//возвращаемый результат от сервера
            $$('result',$$('result').innerHTML+'<br />'+data);
        }
    });
}
 
function SendPost() {
    //отправляю POST запрос и получаю ответ
    $$a({
        type:'post',//тип запроса: get,post либо head
        url:'ajax.php',//url адрес файла обработчика
        data:{'z':'1'},//параметры запроса
        response:'text',//тип возвращаемого ответа text либо xml
        success:function (data) {//возвращаемый результат от сервера
            $$('result',$$('result').innerHTML+'<br />'+data);
        }
    });
}
 
function SendHead() {
    //отправляю HEAD запрос и получаю заголовок
    $$a({
        type:'head',//тип запроса: get,post либо head
        url:'ajax.php',//url адрес файла обработчика
        response:'text',//тип возвращаемого ответа text либо xml
        success:function (data) {//возвращаемый результат от сервера
            $$('result',$$('result').innerHTML+'<br />'+data);
        }
    });
}
</script>


Содержимое файла ajax.php

Код

<?php
if(isset($_GET['q'])) {
    header("Content-type: text/txt; charset=UTF-8");
    if($_GET['q']=='1') {
        echo 'запрос GET успешно обработан, q = 1';
    }
    else {
        echo 'карявый GET запрос';
    }
}
if(isset($_POST['z'])) {
    header("Content-type: text/txt; charset=UTF-8");
    if($_POST['z']=='1') {
        echo 'запрос POST успешно обработан, z = 1';
    }
    else {
        echo 'карявый POST запрос';
    }
}
?>



Остальные примеры смотрите на оф сайте фреймворка

Рейтинг:
(0%) -----
· PM · E-Mail · WWW · ·
^

Опции темы Ответить · Новая Тема ·Создать опрос

 



[ Время генерации скрипта: 0.0299 ]   [ Использовано запросов: 11 ]   [ GZIP включён ]