使用jQuery / AJAX在两个页面之间发送数据

时间:2013-06-14 09:31:27

标签: jquery ajax long-polling

我正在寻找一种在两个不同页面上的两个不同Div之间发送数据的方法,两者都在同一个域中。

这是一个学习练习,因为我是jQuery和AJAX的新手,我一直在寻找一种简单的方法来做到这一点,但大多数答案或选项似乎很复杂,涉及安装其他软件等。

我想让一个html页面监听一个事件,另一个html页面会在发生事件时发送一个事件,例如;

第1页 - 倒计时时钟,每次达到新的小时,它都会将数据发送到第2页

第2页 - 收听此数据时,它会在div中显示数据

这不是我想要的倒计时时钟,它只是一个例子,但理论是我需要的。是否可以通过2个平面html页面和一些jQuery / AJAX代码进行设置?它不需要安全或优化,就像我说它只是为了学习。

2 个答案:

答案 0 :(得分:1)

也许您会关注nodejssocket.io 这是一个很棒的工具,可以通过javascript完成所有事情。

答案 1 :(得分:1)

最简单的方法是,安装服务器(例如wamp),然后您可以通过使用数据库或文件在您的页面之间进行通信,然后使用类似的东西:

第1页:

<a id="sendData">Send Data to Page 2 </a>

var url = http://localhost/yoursite/writeToFile.php
$('a#sendData').click(
               $.ajax({ url: url, type: "POST", data:{test:'test'} })
                .done(function() {
                      $(this).append(' sent!');
               });
)};

第2页:

<div>Listening to Page 1 </div>

window.setInterval(function(){
 listenToPage1();
}, 5000);

 function listenToPage1()
{
    var url = http://localhost/yoursite/readFromFile.php
    $.get(url, function(data) { $('div').html(data);   });
}

<强> writeToFile.php

<?php
   $fp = fopen('data.txt', 'a');
   fwrite($fp, $_POST);
   fclose($fp);
?>

readFromFile.php

<?php 
   readfile('data.txt');
?>

yoursite文件夹:

www/
  /yousite
   readFromFile.php
   writeToFile.php
   page1.php
   page2.php
   data.txt

当然,您可以使用nodejs直接通过javascript进行互动,但我认为最好从学习基础开始,然后您可以转到nodejs(它不会这意味着nodejs非常复杂:p)