ScriptJava простой javascript - примеры и документация

Компьютеры, мобильные утройства и т.д.
  • Реклама

Аватара пользователя

Автор темы
xzxz
Сообщения: 2
Зарегистрирован: 05 июн 2011, 02:41
Georgia

ScriptJava простой javascript - примеры и документация

Сообщение xzxz » 09 фев 2012, 00:32

ScriptJava Framework - $$().$$().$$().$$().$$()...
:kruto:
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 в javascript

Вначале нужно подключить сам 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>
       ';
   }
?>


Как динамически подключить javascript

Вначале нужно подключить сам 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 запрос';
       }
   }
?>



Остальные примеры смотрите на оф сайте фреймворка
http://scriptjava.net/

Ссылка:
Скрыть ссылки на пост
Показать ссылки на пост

Реклама

Вернуться в «Информационные технологии»



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

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