使用 jquery 进行 ajax 日历导航

Question

我在 html 中有下一个和上一个链接

<a href="/event-sort/calendar/2009/9/sports/">prev</a>
<a href="/event-sort/calendar/2009/11/sports/">next</a>

当它们被点击时，我希望页面进行 ajax 调用以加载将更新日历的 html 的 php 脚本

现在当日历更新时，箭头已被移除并再次添加到 dom，所以我无法绑定这些事件

这就是我现在拥有的

function url_to_array(string)
{
    var url = string;
    var url_array = url.split('/');
    return url_array;
}

function update_cal(evt)
{
    var url_array = url_to_array(evt.data);

    $('#master-calendar').css({
        background:'url(/images/ajax-load.gif) no-repeat left top',
        height:'600px'
    }).html('');

    $.get('/ajax_events.php',
        {
            view:url_array[2],
            year:url_array[3],
            month:url_array[4],
            category:url_array[5]
        },
        function(returned_data)
        {
            $('#content').html(returned_data);
            var element_id = $(evt.target).attr('id');
            var element_href = $('#' + element_id).attr('href');
            $('#' + element_id).unbind('click', update_cal).bind('click', element_href, update_cal);
        }
    );

    evt.preventDefault();
}   

// 文档就绪 $(document).ready(function(){

var prev_link = $('#cal_nav_previous').attr('href');
$('#cal_nav_previous').bind('click', prev_link, update_cal);

var next_link = $('#cal_nav_next').attr('href');
$('#cal_nav_next').bind('click', next_link, update_cal);

});// 结束文档就绪

我真的很想为我的下一个和上一个按钮使用一个 update_cal 函数

我希望日历可以通过 js 访问，这就是 url 中的 href 和日期数字的原因，任何帮助将不胜感激

我曾尝试过 jquery 现场活动，但没有太大的成功

我可以同时将 update_cal 函数绑定到下一个和上一个链接吗？

Answer 1

这里似乎有几个问题，所以我会尝试回答其中的几个。

要避免链接的默认行为，您可以使用 jquery：

$('a').click(function(event){
    event.preventDefault();
});

当然你必须指定正确的链接...

要将变量从链接传递到您的脚本，您可以使用 rel 属性：

<a href="/event-sort/calendar/2009/9/sports/" rel="200909">prev</a>
<a href="/event-sort/calendar/2009/11/sports/" rel="200911">next</a>

并使用 jquery 读取 rel 属性。

要自动绑定事件，可以将绑定部分放在 ajax_events.php 脚本中

好像是这样，还是我错过了什么？

顺便说一句，我试图计算我的答案，但这会弄乱代码，它是如此大胆......