Форум Сайтостроение Веб-строительство

Обновление таблички

12
-
На сайте с 07.12.2005
Offline
97
-K-
#11

Самый оптимальный вариант IMHO сделать на аяксе.

Должно получиться что то типа того...

Файл основной(куда подгружается блок): 


<!DOCTYPE html 

     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

	<script type="text/javascript" src="htmlhttprequest.js"></script>

</head>

<body onload="updateBlock();">

Содержимое подгруженного блока:

<div id="dataCont">

</div>

<script type="text/javascript">

//<![CDATA[
function loadXml(url, callback)

{

	var httpRequest = new HTMLHttpRequest('httpRequest', callback, false);

	httpRequest.load(url);		

}



function updateBlock()

{

	loadXml("upl.html", continueAfterDataLoad);

	return false;

}



function continueAfterDataLoad(xdoc, txt, url)

{

	var container = document.getElementById('dataCont');

	if (container)

	{

		container.innerHTML = txt;

	}

	

	setTimeout("updateBlock();", 10 * 1000);

}

//]]>

</script>

</body>

</html>

Файл с подгружаемым блоком (я его назвал upl.html - можно изменить в JavaScript часте предыдущего файла): 


<table border="1">

<tr>

	<td>123</td>

	<td>456</td>

	<td>789</td>

</tr>

</table>

Ну и не забудьте файлик с библиотекой (из аттачмента) положить в соответствующее место.

Вот как должно работать http://www.svdev.ru/se/wupl.html

zip htmlhttprequest.js.zip
eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Могут ли «плохие» входящие
-
На сайте с 07.12.2005
Offline
97
-K-
#12

Завтра могу написать код для использования без этой тяжелой библиотеки, если надо.

-
На сайте с 07.12.2005
Offline
97
-K-
#13

Как и обещал, обновленный код, без использования библиотеки: 


<!DOCTYPE html 

     PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"

     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>

<head>

	<meta http-equiv="Content-Type" content="text/html;charset=utf-8"/>

	<script type="text/javascript">

		//<![CDATA[

		var xmlHttp = createXmlHttpRequestObject();

		var serverAddress = 'upl.html'; ///Путь к файлу на сервере

		var updateInterval = 10; /// Интервал обновления в секундах



		function createXmlHttpRequestObject()

		{

			var xmlHttp;

			

			try

			{

				xmlHttp = new XMLHttpRequest();

			}

			catch(e)

			{

				var XmlHttpVersions = new Array(

					"MSXML2.XMLHTTP.6.0",

					"MSXML2.XMLHTTP.5.0",

					"MSXML2.XMLHTTP.4.0",

					"MSXML2.XMLHTTP.3.0",

					"MSXML2.XMLHTTP",

					"Microsoft.XMLHTTP");

					

				for(var i=0; i<XmlHttpVarsions.length && !xmlHttp; i++)

				{

					try

					{

						xmlHttp = new ActiveXObject(XmlHttpVersions);

					}

					catch (e) {}

				}

			}

			

			return xmlHttp;

		}



		function updateBlock()

		{

			if (xmlHttp)

			{

				try

				{

					xmlHttp.open("GET", serverAddress, true);

					xmlHttp.onreadystatechange = handleRequestStateChange;

					xmlHttp.send(null);

				}

				catch(e) { }	

			}

		}



		function handleRequestStateChange()

		{

			var container = document.getElementById('dataCont');

			var serverResponse = xmlHttp.responseText;

			if (container && xmlHttp.readyState == 4 && xmlHttp.status == 200 && serverResponse.length > 0)

			{

				container.innerHTML = serverResponse;

				setTimeout("updateBlock();", updateInterval * 1000);

			}

		}

		//]]>

	</script>

</head>

<body onload="updateBlock();">

Block data:

<div id="dataCont"></div>

</body>

</html>
12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий