javascript - 使用 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，因此我无法绑定(bind)这些事件。

这是我现在拥有的:

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

});// End Document Ready

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

我希望可以使用 js 访问日历，这就是 url 中的 href 和日期数字的原因，我们将不胜感激。

我曾尝试过 jQuery 现场事件，但没有取得太大成功。

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

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 属性。

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

好像是这样，还是我漏掉了什么？

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