Основы программирования на JavaScript
Шрифт:
dim a(30)
'Заполнение массива именами
a(1)="Anna"
a(2)="Brittany"
a(3)="Cinderella"
a(4)="Diana"
a(5)="Eva"
a(6)="Fiona"
a(7)="Gunda"
a(8)="Hege"
a(9)="Inga"
a(10)="Johanna"
a(11)="Kitty"
a(12)="Linda"
a(13)="Nina"
a(14)="Ophelia"
a(15)="Petunia"
a(16)="Amanda"
a(17)="Raquel"
a(18)="Cindy"
a(19)="Doris"
a(20)="Eve"
a(21)="Evita"
a(22)="Sunniva"
a(23)="Tove"
a(24)="Unni"
a(25)="Violet"
a(26)="Liza"
a(27)="Elizabeth"
a(28)="Ellen"
a(29)="Wenche"
a(30)="Vicky"
'извлечение
q=ucase(request.querystring("q"))
'поиск всех рекомендаций из массива, если длина q>0
if len(q)>0 then
hint=""
for i=1 to 30
if q=ucase(mid(a(i),1,len(q))) then
if hint="" then
hint=a(i)
else
hint=hint & " , " & a(i)
end if
end if
next
end if
'Вывод "нет предложений" если рекомендуемого имени не найдено
'или вывод подходящих значений
if hint="" then
response.write("нет предложений")
else
response.write(hint)
end if
%>
Приведенный выше код переписан на PHP.
Примечание: Чтобы выполнить весь пример на PHP, не забудьте изменить значение переменной url в "clienthint.js" с "gethint.asp" на "gethint.php".
<?php
// Заполняем массив именами
$a[]="Anna";
$a[]="Brittany";
$a[]="Cinderella";
$a[]="Diana";
$a[]="Eva";
$a[]="Fiona";
$a[]="Gunda";
$a[]="Hege";
$a[]="Inga";
$a[]="Johanna";
$a[]="Kitty";
$a[]="Linda";
$a[]="Nina";
$a[]="Ophelia";
$a[]="Petunia";
$a[]="Amanda";
$a[]="Raquel";
$a[]="Cindy";
$a[]="Doris";
$a[]="Eve";
$a[]="Evita";
$a[]="Sunniva";
$a[]="Tove";
$a[]="Unni";
$a[]="Violet";
$a[]="Liza";
$a[]="Elizabeth";
$a[]="Ellen";
$a[]="Wenche";
$a[]="Vicky";
//извлечение параметра q из URL
$q=$_GET["q"];
//поиск всех рекомендаций в массиве, если длина q>0
if (strlen($q) > 0)
{
$hint="";
for($i=0; $i<count($a); $i++)
{
if (strtolower($q)==strtolower(substr($a[$i],0,strlen($q))))
{
if ($hint=="")
{
$hint=$a[$i];
}
else
{
$hint=$hint." , ".$a[$i];
}
}
}
}
// Вывод "нет предложений", если рекомендаций не найдено
// или вывод подходящих значений
if ($hint == "")
{
$response="нет предложений";
}
else
{
$response=$hint;
}
//вывод ответа
echo $response;
?>
AJAX можно
использовать для интерактивного взаимодействия с базой данных.В следующем примере приложения AJAX будет показано, как Web-страница может извлекать информацию из базы данных с помощью технологии AJAX.
На Web-странице выводится список выбора с именами клиентов.
При выборе любого клиента на странице выводится связанная с ним информация из базы данных
Описанный выше пример страницы содержит простую форму HTML и ссылку на сценарий JavaScript:
<html>
<head>
<script src="selectcustomer.js"></script>
</head>
<body>
<form>
Выберите заказчика:
<select name="customers" onchange="showCustomer(this.value)">
<option value="ALFKI">Alfreds Futterkiste
<option value="NORTS ">North/South
<option value="WOLZA">Wolski Zajazd
</select>
</form>
<div id="txtHint"><b>Информация о заказчике будет выводиться здесь.</b></div>
</body>
</html>
Как можно видеть, это просто форма HTML с раскрывающимся списком с названием "customers".
Параграф ниже формы содержит тег div с именем "txtHint". Тег div используется в качестве поля для заполнения получаемой с Web-сервера информацией.
Когда пользователь выбирает данные (имя заказчика), выполняется функция "showCustomer". Выполнение функции запускается событием "onchange". Другими словами, каждый раз, когда пользователь изменяет значение в поле раскрывающегося списка, вызывается функция showCustomer.
Код JavaScript показан далее.
Следующий далее код JavaScript находится в файле "selectcustomer.js":
var xmlHttp
function showCustomer(str)
{
xmlHttp=GetXmlHttpObject
if (xmlHttp==null)
{
alert ("Браузер не поддерживает запросы HTTP")
return
}
var url="getcustomer.asp"
url=url+"?q="+str
url=url+"&sid="+Math.random
xmlHttp.onreadystatechange=stateChanged
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}
function stateChanged
{
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
document.getElementById("txtHint").innerHTML=xmlHttp.responseText
}
}
function GetXmlHttpObject
{
var objXMLHttp=null
if (window.XMLHttpRequest)
{
objXMLHttp=new XMLHttpRequest
}
else if (window.ActiveXObject)
{
objXMLHttp=new ActiveXObject("Microsoft.XMLHTTP")