Question

我有一个包含大量内容的主页，其中一个内容是一个小日历。

对于日历，我有一个上个月和下个月的链接。我想要做的是在几个月之间切换而不必刷新页面。

<div id='cal_wrapper'>
  <a href='main.php?month=$m&year=$y' class='selector'>Previous month</a>
  <a href='main.php?month=$m&year=$y' class='selector'>Next month</a>
  <?PHP          
   echo $calendar;     
  ?>
</div>

Javascript如下：

<script type="text/javascript">
$(document).ready(function() {
$('#cal_wrapper a.selector').click(function(e){
    $('#cal_wrapper').load( $(this).attr('href') ); 
    e.preventDefault(); 
}); 
});
</script>

当我点击prev / next链接时，整个页面被重新加载到cal_wrapper div中。我被卡住了。

Answer 1

也许先尝试e.preventDefault()，即：

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

Answer 2

如果我理解你的问题，我认为你希望$(this).attr('href')引用$('#cal_wrapper a.selector')的href属性。相反，发生的是$(this)，此时实际上指的是$('#cal_wrapper')元素，而不是$("#cal_wrapper a.selector')元素。

如果这是正确的，您可能想要做的是将$('#cal_wrapper')存储在临时变量中，即

$('#cal_wrapper a.selector').click(function(e) {
    var o = $(this);
    $('#cal_wrapper').load($(o).attr('href')); 
    e.preventDefault(); 
});

在主页上获取日历以切换月份而不刷新页面

2 个答案: