За последние 24 часа нас посетили 21775 программистов и 1331 робот. Сейчас ищут 692 программиста ...

обновление на сранице не перезагружая её..

Тема в разделе "JavaScript и AJAX", создана пользователем gkhelloworld, 19 июл 2008.

  1. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    доброго =) столкнулся с проблемой, я написал простенький скриптик подсчёта хвостов хотелось бы это красиво оформить.
    хочу с помощью ajax сделать чтобы на страницы было
    пример
    всего хостов: 73 - и это число обновлялось при каждом заходе на страницу, не перезагружая страницу.
    п.с. информацию о кол-ве хостах буду брать с базы данных mysql

    может у кого-то есть примерчик подкиньте..
     
  2. Ti

    Ti Активный пользователь

    С нами с:
    3 июл 2006
    Сообщения:
    2.378
    Симпатии:
    1
    Адрес:
    d1.ru, Екатеринбург
  3. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    а можно поподробней.. а то я нечего не понял..или примерчики :oops:
     
  4. S.t.A.M.

    S.t.A.M. Активный пользователь

    С нами с:
    10 сен 2007
    Сообщения:
    1.041
    Симпатии:
    0
    Это как??? Как ты хочешь каждый раз заходить на страницу не перезагружая ее?! Свернуть и развернуть браузер?!
     
  5. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    если я не правильно выразился.. посмотрите пример на это сайте

    http://www.videolan.org/vlc/

    справа на сайте
    VLC 0.8.6 downloads: 92,568,975 <--- ЭТО ЧИСЛО ОБНОВЛЯЕТСЯ БЕЗ ПЕРЕГРУЗКИ СТРАНИЦЫ, СЧИТАЕТ КОЛ-ВО ЗАГРУЗОК
    1.9 downloads per second
     
  6. neyr00n

    neyr00n Активный пользователь

    С нами с:
    29 ноя 2007
    Сообщения:
    106
    Симпатии:
    0
    offtop on
    гыгы. зашли на сайтик, было такое число - 92,586,967. чутка подождали, стало такое число - 92,587,031. обновили страничку... и все по новой =)
    offtop off
     
  7. S.t.A.M.

    S.t.A.M. Активный пользователь

    С нами с:
    10 сен 2007
    Сообщения:
    1.041
    Симпатии:
    0
    Вот она функция которая считает (вытащил у них):

    [js]

    function update()
    {
    if (currentCount) {

    interval = (1000 / rate);

    if (!displayCount)
    displayCount = currentCount + 1;
    else if (displayCount < currentCount)
    setTimeout("catchUp()", interval / 2);
    else if (displayCount > currentCount)
    displayCount += 0;
    else
    displayCount += 1;

    currentCount++;

    // Update the display
    setText(document.getElementById(counterID), formatCount(displayCount));
    setText(document.getElementById( "dlrate"), rate );

    // Reset the update timeout
    setTimeout("update()", interval);

    } else {
    setTimeout("update()", 1000);
    }
    }[/js]

    т.е. работает это след. образом:
    Аяксом запрашивается с сервера текщее кол-во скачиваний, и интервал с котороым скачивается программа, далее тупо прибавляет по одному через этот интервал.
    Непонятно нафига это сделано аяксом раз он и так один раз запрашивается при инициализации....

    Кстати, на vkontakte.ru так же счетчик работает!

    P.P.S. Понял почему аякс - каждую минуту посылается запрос на сервер и интервал корректируется.
     
  8. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    эх..как бы его пришпилить к php :oops:
     
  9. DarkElf

    DarkElf Активный пользователь

    С нами с:
    22 окт 2006
    Сообщения:
    1.632
    Симпатии:
    0
    gkhelloworld

    пых на сервере, яваскрипт - на клиенте. клиену абсолютно фиолетово, какая технология на сервере ему данные отдает...
     
  10. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    помогите с примером setTimeout...

    Объясните почему не работает этот пример

    что это? 2 файла один xml другой html

    html файл выводит информацию из xml файла методом ajax. т.е. информация в xml файле динамическая и обновляется постоянно. ajaxом я хочу вытаскивать информацию из xml файла каждую секунду и показывать её в реально времени в HTML файле без перезагрузки страницы HTML. как счетчик...впринципе это и будет счетчик

    xml

    HTML:
    1. <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    2. <script type="text/javascript">
    3. var xmlHttp = createXmlHttpRequestObject();
    4.  
    5. function createXmlHttpRequestObject()
    6. {  
    7.   var xmlHttp;
    8.   if(window.ActiveXObject)
    9.   {
    10.     try
    11.     {
    12.       xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    13.     }
    14.     catch (e)
    15.     {
    16.       xmlHttp = false;
    17.     }
    18.   }
    19.   else
    20.   {
    21.     try
    22.     {
    23.       xmlHttp = new XMLHttpRequest();
    24.     }
    25.     catch (e)
    26.     {
    27.       xmlHttp = false;
    28.     }
    29.   }
    30.   if (!xmlHttp)
    31.  
    32.     alert("Error creating the XMLHttpRequest object.");
    33.   else
    34.     return xmlHttp;
    35. }
    36. function process()
    37. {
    38.   if (xmlHttp.readyState == 4 || xmlHttp.readyState == 0)
    39.   {
    40.     xmlHttp.open("GET", "ajax.php", true);  
    41.     xmlHttp.onreadystatechange = handleServerResponse;
    42.     xmlHttp.send(null);
    43.   }
    44. }
    45. function handleServerResponse()
    46. {
    47.   if (xmlHttp.readyState == 4)
    48.   {
    49.     if (xmlHttp.status == 200)
    50.     {
    51.       xmlResponse = xmlHttp.responseXML;
    52.       xmlDocumentElement = xmlResponse.documentElement;
    53.       helloMessage = xmlDocumentElement.firstChild.data;
    54.       document.getElementById("divMessage").innerHTML =
    55.                                             '<i>' + helloMessage + '</i>';
    56.     }
    57.     else
    58.     {
    59.       alert("There was a problem accessing the server: " + xmlHttp.statusText);
    60.     }
    61.   }
    62. }
    63.  
    64. <script type="text/javascript">
    65. interval = (1000 / 1);
    66. setTimeout("process()", 1);
    67. </head>
    68.  <body>
    69.      <div id="divMessage" />
    70.   </body>
    71. </html>

    вот xml файл
    Код (Text):
    1.  
    2. <?xml version="1.0" encoding="UTF-8" standalone="yes"?>
    3. <response>
    4. 444443 <--- ЭТА ЦИФРА У МЕНЯ ПОСТОЯННО ОБНОВЛЯЕТСЯ!
    5. </response>
    6. ?>
    этим скриптом я хотел каждую секунду перезагружать файл xml и показывать данные в реальном времени не перезагружая основную страницу с помощью ajax!
     
  11. angelo4ek

    angelo4ek Активный пользователь

    С нами с:
    27 авг 2006
    Сообщения:
    85
    Симпатии:
    0
    Обновить <div> AJAX'ом

    Простите за безумно ламерский вопрос,но никак не получается.
    есть
    Код (Text):
    1. <div id="data"></div>
    Как мне ей прилепить автообновление на AJAX?
    Не нужно не обновление контента ничего такого, просто чтоб именно этот Див автообновлялся.
    Заранее благодарю за посильную помощь.
     
  12. AterCattus

    AterCattus Активный пользователь

    С нами с:
    6 фев 2008
    Сообщения:
    80
    Симпатии:
    0
    Адрес:
    Санкт-Петербург
    angelo4ek
    [js] var req = 0;
    if (window.XMLHttpRequest) {
    try {
    req = new XMLHttpRequest();
    } catch (e){}
    } else
    if (window.ActiveXObject) {
    try {
    req = new ActiveXObject('Msxml2.XMLHTTP');
    } catch (e) {
    try {
    req = new ActiveXObject('Microsoft.XMLHTTP');
    } catch (e) { return null; }
    }
    }
    if ( !req ) return;

    req.open( 'GET', 'http://site.ru/foo/bar.php?give_me_a_div_content', true );
    req.send( null );

    if ( req.readyState == 4 ) {
    if ( req.status == 200 ) {
    document.getElementById( 'data' ).innerHTML = req.responseText;
    }
    else {
    alert( 'Error: '+ req.status + ' '+ req.statusText );
    }
    } [/js]

    Ну примерно так. Или смотри пост Ti #2.
     
  13. AterCattus

    AterCattus Активный пользователь

    С нами с:
    6 фев 2008
    Сообщения:
    80
    Симпатии:
    0
    Адрес:
    Санкт-Петербург
    gkhelloworld
    ?
    это флаг синхронного режима, а ты делаешь все через асинхронный.
     
  14. angelo4ek

    angelo4ek Активный пользователь

    С нами с:
    27 авг 2006
    Сообщения:
    85
    Симпатии:
    0
    AterCattus

    Понимаешь у меня какая проблема,на странице отображение этого дива идет через функцию display();
    А построение отображения через шаблоны. Когда я использую стандартные AJAX библиотеки (а перепробывал не мало) эта гадость делает так как надо, только еще и дублирует контент страницы которую я указываю для элемент GET.
    Да знаю, что можно сказать: - Перестрой отображение, - сразу отвечу: "Невозможно!!!"

    Я вставлял в функцию отображения блока JavaScript, но он перезагружает всю страницу, при чем именно перезагружает
    Вот он:
    [js]
    <script>
    <!--

    var limit=\"0:30\"

    if (document.images){
    var parselimit=limit.split(\":\")
    parselimit=parselimit[0]*60+parselimit[1]*1
    }
    function beginrefresh(){
    if (!document.images)
    return
    if (parselimit==1)
    window.location.reload()
    else{
    parselimit-=1
    curmin=Math.floor(parselimit/60)
    cursec=parselimit%60
    if (curmin!=0)
    curtime=curmin+\" minutes and \"+cursec+\" seconds left until page refresh!\"
    else
    curtime=cursec+\" seconds left until page refresh!\"
    window.status=curtime
    setTimeout(\"beginrefresh()\",1000)
    }
    }

    window.onload=beginrefresh
    //-->
    </script>
    [/js]
    Вот если бы кто помог его проапгрейдить в AJAX, чтоб без перезагрузки страницы,тогда это было бы идеально, а то трафика так не напасешся с таким обновлением дива.
     
  15. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    и? с false нечего не пашет =)
     
  16. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    ну что за бред... в FireFox все ок,
    в IE6 ошибка
    FALSE - определение отсутствует
    но в firefoxe ошибка выдается в том случае если перехожу с первой страницы на второстипенную



    [js]var xmlHttp = createXmlHttpRequestObject();
    function createXmlHttpRequestObject()
    {
    var xmlHttp;
    if(window.ActiveXObject)
    {
    try
    {
    xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    catch (e)
    {
    xmlHttp = false;
    }
    }
    else
    {
    try
    {
    xmlHttp = new XMLHttpRequest();
    }
    catch (e)
    {
    xmlHttp = false;
    }
    }
    if (!xmlHttp)

    alert("Error creating the XMLHttpRequest object.");
    else
    return xmlHttp;
    }
    function process()
    {
    if (xmlHttp.readyState == 4 || xmlHttp.readyState == 0)
    {
    xmlHttp.open("GET", "aurls.xml", true);
    xmlHttp.onreadystatechange = handleServerResponse;
    xmlHttp.send(null);
    }
    }
    function handleServerResponse()
    {
    if (xmlHttp.readyState == 4)
    {
    if (xmlHttp.status == 200)
    {
    xmlResponse = xmlHttp.responseXML;
    xmlDocumentElement = xmlResponse.documentElement;
    helloMessage = xmlDocumentElement.firstChild.data;
    document.getElementById("divMessage").innerHTML =
    '<b>' + helloMessage + '</b>';
    setTimeout("process()", 1000);
    }
    else
    {
    alert("There was a problem accessing the server: " + xmlHttp.statusText);
    }
    }
    }
    // addons ;-)
    function formatCount(count)
    {
    count = count.toString();
    for (var i = count.length - 3; i > 0 ; i -= 3) {
    count = count.slice(0, i) + ' ' + count.slice(i, count.length);
    }
    return count;
    }[/js]

    ставлю здесь
    xmlHttp.open("GET", "aurls.xml", true); вместо true -> false - всеравно ошибка одна и та же.!

    вот сраница:


    HTML:
    1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    4. <title>Title</title>
    5. <script src="/js/ajaxcount.js" type="text/javascript"></script>
    6. </head>
    7. <script type="text/javascript">
    8. setTimeout("process()", 1000);
    9. Всего ссылок в базе:&nbsp;<font style="color:#FF0000;"><span id="divMessage">Loading...</span></font>
     
  17. gkhelloworld

    gkhelloworld Активный пользователь

    С нами с:
    18 ноя 2007
    Сообщения:
    311
    Симпатии:
    0
    Адрес:
    PHP.ru
    проблема решина!

    вот причина всех бед

    xmlHttp.open("GET", "aurls.xml", true); надо
    xmlHttp.open("GET", "/aurls.xml", true);

    в моем случае я использую mod_rewrite