Пример 4. Callback
(без веб сервера не заработает)
page4.htm
<html>
<body>
<input type=text id="x" value="2" >
<input type=button value="TEST" onclick="get()">
<script id="get" type="text/javascript">
function get()
{
var x=document.getElementById("x").value; // получаем исходное значение
var loader=document.createElement("script"); // создаем скрипт
loader.id="loader"; // id понадобится чтобы потом удалить скрипт
loader.type="text/javascript";
// параметры: x=число для обработки, callback=имя функции возврата
loader.src="calc.asp"+"?x="+escape(x)+"&callback=getEnd&rnd="+Math.random();
document.body.appendChild(loader);
}
function getEnd(result) // сюда попадем по окончании работы скрипта calc.asp
{
var x=document.getElementById("x"); // отображаем результат работы запроса к серверу
x.value=result;
var loader=document.getElementById("loader"); // удаляем отработавший скрипт
document.body.removeChild(loader);
}
</script>
<body>
</html>calc.asp
<%
// эта часть исполняется на сервере
var callback=Request.QueryString("callback")+""; // получили имя функции возврата
var x=Request.QueryString("x")+""; // получили параметр x
var result=x*2; // обработали его
%>
// эта часть исполняется в браузере
<%=callback%>("<%=result%>"); // ASP превратит это в: getEnd("4");<html>
<body>
<p id="x">text</p>
<input type=button value="TEST" onclick="get()">
<script id="get" type="text/javascript">
function get()
{
var loader = document.createElement("script");
loader.id = "loader";
loader.type = "text/javascript";
loader.src = "async.js" + "?rnd=" + Math.random();
document.body.appendChild(loader);
}
</script>
<body>
</html>Благодарность за разъяснения - fps.
]]><input type=button value="TEST" onclick="document.getElementById('get').src='async.js'+'?rnd='+Math.random()">Благодарность за разъяснения - fps.
]]><html>
<body>
<script id="get" type="text/javascript"></script>
<p id="x">text</p>
<br>
<input type=button value="TEST" onclick="document.getElementById('get').src='async.js'">
<body>
</html>Файл async.js:
var x = document.getElementById('x'); // получаем параметр
x.innerHTML = new Date(); // отображаем результатПри нажатии на кнопку "Test" на html-странице текстовое содержимое тега "p" будет изменено, без обновления самой страницы.
В Opera это сработает только один раз, после чего она скеширует скрипт и больше его подгружать не будет.
Благодарность за разъяснения - fps.