如何使用ajax加載<a href="">標記的值

Question

我正在使用Codeigniter Calendar Class庫，並且希望「下個月」和「上個月」按鈕無需重新加載頁面即可工作，只需刷新月份即可。

在我的模型，我創建了以下配置日曆模板：

 $this->conf = array(
      'start_day' => 'monday', 
      'show_next_prev' => true, 
      'next_prev_url' => base_url().'index.php/admin/reservation'    
     ); 
    $this->conf['template'] = ' 

    {table_open}<table border="0" cellpadding="0" cellspacing="0"class="calendar">{/table_open} 

     {heading_row_start}<tr>{/heading_row_start} 

     {heading_previous_cell}<th class="prev_button"><a href="{previous_url}">&lt;&lt;</a></th>{/heading_previous_cell} 
     {heading_title_cell}<th colspan="{colspan}">{heading}</th>{/heading_title_cell} 
     {heading_next_cell}<th class="next_button"><a href="{next_url}">&gt;&gt;</a></th>{/heading_next_cell} 

     {heading_row_end}</tr>{/heading_row_end} 

     {week_row_start}<tr>{/week_row_start} 
     {week_day_cell}<td>{week_day}</td>{/week_day_cell} 
     {week_row_end}</tr>{/week_row_end} 

     {cal_row_start}<tr class="days">{/cal_row_start} 
     {cal_cell_start}<td>{/cal_cell_start} 

     {cal_cell_content} 
      <div class="day_num">{day}</div> 
      <div class="content">{content}</div> 
     {/cal_cell_content} 
     {cal_cell_content_today} 
      <div class="day_num highlight">{day}</div> 
      <div class="content">{content}</div> 
     {/cal_cell_content_today} 

     {cal_cell_no_content} 
      <div class="day_num">{day}</div> 
     {/cal_cell_no_content} 
     {cal_cell_no_content_today} 
      <div class="day_num highlight">{day}</div> 
     {/cal_cell_no_content_today} 

     {cal_cell_blank}&nbsp;{/cal_cell_blank} 

     {cal_cell_end}</td>{/cal_cell_end} 
     {cal_row_end}</tr>{/cal_row_end} 

     {table_close}</table>{/table_close} 

在我看來：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('.next_button').click(function(){ 
      alert("working"); 
     });   
    });  

</script> 

我真的不知道如何加載我的日曆模板中類「prev_button」和「next_button」的值。所以請幫忙！

Answer 1

終於找到了解決辦法。見下：

<script> 
    $(document).ready(function(){  
    $(document).on('click','.next_button', function() { 
     var href = $(this).find('a').attr('href'); 
     $.post(href, { }, function(data){ 
      $('#calendar').html(data); 
     }) 

     return false; 
    }); 

    $(document).on('click','.prev_button', function() { 
     var href = $(this).find('a').attr('href'); 
     $.post(href, { }, function(data){ 
      $('#calendar').html(data); 
     }) 

     return false; 
    }); 

    }); 
    </script> 

Answer 2

如果您只是需要將該類添加到一個鏈接，那麼你可以使用：

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('.next_button').click(function(){ 
      $('a').addClass('YourClass'); 
     }); 
    }); 
</script> 

Answer 3

嘗試

$('.next_button').click(function(){ 
    var href = $(this).find('a').attr('href'); 

    $.ajax({ 
    url: href 
    }); 
});