Получение календаря на главной странице для переключения месяцев без обновления страницы

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>

Что происходит, когда я нажимаю на предыдущую / следующую ссылку, вся страница перезагружается в div cal_wrapper. Я застрял.

Answer 1

Если я правильно понимаю ваш вопрос, я думаю, вы хотите, чтобы $(this).attr('href') ссылался на атрибут href $('#cal_wrapper a.selector').Вместо этого происходит то, что $(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(); 
});

Answer 2

Возможно, попробуйте сначала поставить e.preventDefault(), т.е.