如何使用 ajax 加载 <a href=""> 标记的值

Question

我正在使用 Codeigniter 日历类库，我希望“下个月”和“上个月”按钮在不重新加载页面的情况下工作，只需刷新月份即可。

在我的模型中，我使用以下配置创建了日历模板：

        $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
    });
});