基本ajax获取请求

Question

我正在制作一个带有2个链接的日历，一个回到一个月，另一个回到一个月。

这是我cal.php文件：

<div class='cal_wrapper' id='cal'> 
<?php 
    echo "<a href='cal.php?month=m&year=y'>Prev Month</a>"; 
    echo "<a href='cal.php?month=m&year=y'>Next Month</a>"; 

    echo $calendar; 

?> 
</div> 

我试图做的是使用jquery/AJAX更新有什么cal_wrapper DIV中，而无需刷新页面。我看起来很难，但找不到任何不使用HTML表单就可以完成的例子。我怎样才能通过GET请求，月，年送2个变量，应该是相当basic..but我要去交目光炯炯试图找到对互联网络的东西..

Answer 1

首先给你的链接类

echo "<a class='month_selector' href='cal.php?month=m&year=y'>Prev Month</a>"; 
echo "<a class='month_selector' href='cal.php?month=m&year=y'>Next Month</a>"; 

然后，只要单击其中一个链接，就将ajax请求的内容加载到包装div中。

可以使用.load使用#wrapper_div

$('#cal_wrapper a.month_selector').live('click', function(e){ 
    $('#cal_wrapper').load($(this).attr('href') + ' #wrapper_div'); 
    e.preventDefault(); 
}); 

加载页面片段

$('#cal_wrapper a.month_selector').live(function(e){ 
    $('#cal_wrapper').load($(this).attr('href')); 
    e.preventDefault(); 
}); 

编辑，让您的包裹DIV cal_wrapper在#wrapper_div和上面的代码仅加载包装div的内容。由于您正在动态插入链接，因此请使用直播而不是点击。

Answer 2

只是纠正上面的答案。你需要使用jquery方法“live”，因为cal_wrapper div的内容会改变（每当你点击'next/prev'链接时）

把下面的内容放在“主文件”中。第一次加载（内部准备就绪）将加载第一个月和第一年。

<script type="text/javascript"> 

$(document).ready(function() { 
    $('.call_wrapper').load('cal.php?month=m&year=y'); 

    $('.cal_wrapper a.pagination').live('click', function(){ 
     var link = $(this).attr('href'); 
     $('.cal_wrapper').load(link); 
     e.preventDefault(); 
    }); 
}); 

</script> 

<div class='cal_wrapper' id='cal'></div> 

和你cal.php（从里面取出div标签）

<?php 
    echo "<a class="pagination" href='cal.php?month=m&year=y'>Prev Month</a>"; 
    echo "<a class="pagination" href='cal.php?month=m&year=y'>Next Month</a>"; 

    echo $calendar; 
?>