Причина, по которой клиент использует DHTML, в основном для достижения удаленного, просто ставит его в качестве обновленного эффекта.
Файл: исследование.htm
<! Doctype html public -// w3c // dtd html 4.0 Переход // en>
<html>
<голова>
<title> </title>
<meta name = Generator Content = Microsoft Visual Studio 7.0>
</head>
<script language = jscript>
var otblmain; // главная таблица
var strhtml =; // временно использовать глобальные переменные
var bsavestatus = true; // Сохранение успешного?
var icallid; // уникальный номер, который вызывает веб -сервис
// Получить все элементы через веб -сервис
// затем форматируйте выход через функцию обратного вызова OngetItems
функция getItems ()
{
// Вызов метода GetItems веб -сервиса
service.myservice.callService (OngetItems, GetItems);
}
// Функция обратного вызова веб -сервиса
функция OngetItems (результат)
{
if (result.error)
{
Alert (result.errordetail.code +: + result.errordetail.string);
возвращаться ;
}
bbxml.loadxml (result.raw.xml);
var sxml = bbxml.transformnode (bbxsl.xmldocument);
if (bbxml.parseerror.resond ==)
{
strhtml = sxml;
}
еще
{
strhtml = bbxml.parseerror.reess;
}
}
// инициализация страницы
функция Onload ()
{
// подготовка к использованию веб -сервиса
service.useService (sase.asmx? WSDL, MyService);
// Определите объект таблицы записей
otblmain = document.getElementById (tblmain);
}
// Добавить новую запись
// функция состоит в том, чтобы добавить новую строку в таблицу и определить 3 стиля TD и событие
Функция oNADD ()
{
var row = otblmain.insertrow ();
row.bgcolor = #ffffff;
var cellid = row.insertcell ();
cellid.innerhtml = otblmain.rows.length - 1;
cellid.onclick = function () {onidclick (this);};
cellId.Style.cursor = hand;
cellId.title = выбранная запись;
var cellitem = row.insertcell ();
cellitem.style.cursor = crosshair;
cellitem.onclick = function () {onitemClick (this);};
var celldemo = row.insertcell ();
celldemo.style.cursor = help;
celldemo.onclick = function () {ondemoclick (this);};
}
// пункт TD Нажмите на событие
// Функция состоит в том, чтобы вспять слой, а затем получить все элементы с помощью метода GetItems
// после форматирования как innerhtml, как этот новый слой
Функция onitemClick (ячейка)
{
getItems ();
var Odiv = document.createElement (div);
Odiv.zindex = 1;
Odiv.Style.position = Absolute;
ODIV.STYLE.HEITH = 200;
Odiv.Style.width = 300;
Odiv.Style.left = cell.Style.left;
Odiv.Style.top = cell.Style.top;
Odiv.Style.backgroundColor = #99EFF;
Odiv.Style.Border = '0,1 см канавки синий';
Odiv.Style.Overflow = Auto;
Odiv.innerhtml = strhtml;
//document.body.appendchild(odiv);
cell.appendchild (ODIV);
}
// событие выбора элемента TD
функционировать Onitemseled (Cell)
{
var otr = cell.parentelement;
var Otable = otr.parentelement;
var otbody = otable.parentelement;
var Odiv = otbody.parentelement;
Odiv.Style.Display = нет;
var ocell = Odiv.parentelement;
ocell.removechild (ODIV);
ocell.innertext = cell.innertext;
ODIV = NULL;
}
// Выбранная запись
Функция OnidClick (ячейка)
{
var tr = cell.parentelement;
if (tr.bgcolor == #99ccff)
{
tr.bgcolor = #ffffff;
}
еще
{
для (var i = 0; i <otblmain.rows.length; i ++)
{
otblmain.rows [i] .bgcolor = #ffffff;
otblmain.rows [i] .cells [0] .title = Выбранная запись;
}
tr.bgcolor = #99ccff;
cell.title = невыразился;
}
}
// Удалить кнопку Нажмите событие
// Удалить строку, выбранную пользователем, и перенаселение строки
функция ondelete ()
{
var i = getSelectedIndex ();
if (i == 0)
{
предупреждение (не будет удалена записи, не выбран!);
вернуть ложь;
}
еще
{
otblmain.deletero (i);
для (var j = 1; j <otblmain.rows.length; j ++)
{
otblmain.rows [j] .cells [0] .innerText = j;
}
}
}
// Выбрать строку пользователем
функция getSelectedIndex ()
{
для (var i = 0; i <otblmain.rows.length; i ++)
{
if (otblmain.rows [i] .bgcolor == #99ccff)
{
вернуть я;
}
}
возврат 0;
}
// время клика демо -TD в таблице
// Функция состоит в том, чтобы вспять узорчатое окно, и пользователь вводит несколько значений
функция Ondemoclick (Cell)
{
//alert(cell.innertext);
var odemo = window.showmodaldialog (demo.htm, cell.innertext, dialogwidth: 200px; dialogheight: 200px; resizeable: no; статус: нет; прокрутка: нет);
if (odemo! = не определен)
{
cell.innertext = odemo.name + - + odemo.amount;
}
}
// Как нажать на кнопку Сохранить
// Текущий метод состоит в том, чтобы позвонить в Webservice, чтобы сохранить каждую запись по очереди.
// затем очистить сохраненные записи через функцию обратного вызова onsaverecords (результат)
функция onsave ()
{
if (otblmain.rows.length <2)
{
предупреждение (записи не могут быть сохранены!);
вернуть ложь;
}
for (var i = 1; i <otblmain.rows.length && bsavestatus; i ++)
{
var stritemname;
var strdemoname;
var intdemoamount;
striteMname = Otblmain.Rows [i] .cells [1] .innerText;
var arr = otblmain.rows [i] .cells [2] .innertext.split (-);
if (arr.length! = 2)
{
предупреждение (каждая запись должна быть заполнена);
вернуть ложь;
}
еще
{
strdemoname = arr [0];
intdemoamount = arr [1];
// предупреждение (stritemname +, + strdemoname +, + intdemoamount);
window.status =;
icallid = service.myservice.callservice (onsavercords, savevercord, stritemname, strdemonname, parseint (intdemoamount, 10));
window.status = saving + i + record ...;
}
}
}
// Сохранить запись
Функция onsavercords (результат)
{
if (result.error)
{
Alert (result.errordetail.code +: + result.errordetail.string);
bsavestatus = false;
возвращаться ;
}
еще
{
if (result.value)
{
window.status = window.status + успех! ;
otblmain.deletero (1);
}
еще
{
bsavestatus = false;
предупреждение (спасение не удалось по неизвестным причинам!);
window.status = window.status + неудача! Прекратите сохранение! ;
}
}
}
</script>
<body onload = onload ();>
<div id = service style = поведение: url (webservice.htc)>
<xml id = bbxml> </xml>
<xml id = bbxsl src = item1.xsl> </xml>
<br>
<h3 align = center> Пример веб -сервиса </h3>
<br>
<br>
<таблица ширины = 600 align = center id = tblmain bgcolor =#000000 созрея = 1>
<tr bgcolor =#ffffff>
<td ширина = 50> число </td>
<td width = 200> item </td>
<Td> Демо </td>
</tr>
</table>
<p align = center>
<input type = value = value = Add OnClick = onAdd ()> <input type = кнопка значение = удалить onclick = onDelete ()>>
<input type = кнопка значение = сохранить onclick = onsave ()>>
</p>
</body>
</html>
Приведенный выше HTM используется для доступа к мылу веб -сервиса через Microsoft Webservice.htc. Это очень хорошо инкапсулируется. Работа, которую мы должны сделать, - это проанализировать прошедший XML. Я использовал XSL для анализа его. Ниже приведено содержание этого файла
Файл item1.xsl
<? XML версия = 1.0 Encoding = UTF-8?>
<XSL: styleSheet version = 1.0 xmlns: xsl = http: //www.w3.org/1999/xsl/transform xmlns: soap = http: //schemas.xmlsoap.org/soap/envelope/ xmlns: xsi = http: //www.w3.org/2001/xmlschema-instance xmlns: xsd = http: //www.w3.org/2001/xmlschema>
<xsl: output method = html/>
<XSL: шаблон Match =/>
<XSL: Apply-Templates SELECT = // SOAP: Body/>
</xsl: шаблон>
<XSL: шаблон Match = SOAP: Body>
<XSL: Apply-Templates select =*[local-name () = 'getItemSresponse']/*[local-name () = 'getItemSresult'] //>
</xsl: шаблон>
<xsl: шаблон match =*[local-name () = 'getItemSresult']>
<html>
<тело>
<таблица границы = 1>
<tr>
<Th> имя </th>
<Th> Значение </th>
</tr>
<xsl: for-e-exection =*[local-name () = 'Anytype' и @xsi: type = 'item']>
<XSL: Apply-Templates SELECT =./>
</xsl: за то, что он>
</table>
</body>
</html>
</xsl: шаблон>
<xsl: шаблон match =*[local-name () = 'Anytype' и @xsi: type = 'item']>
<tr>
<td style = cursor: hand onclick = onitemselected (это);>
<XSL: Text Disable-output-eScaping = yes> & nbsp; </xsl: text>
<XSL: значение SELECT =*[local-name () = 'name']/>
</td>
<Td>
<XSL: Text Disable-output-eScaping = yes> & nbsp; </xsl: text>
<xsl: значение select =*[local-name () = 'value']/>
</td>
</tr>
</xsl: шаблон>
</xsl: stylesheet>
Приведенный выше пример очень прост, основная трудность заключается в этих DHTML. Но если вы расширите его, вы можете выполнить множество функций, которые вам пришлось реализовать с ActiveX.