jQuery UI Datepicker – 如何更改Datepicker HTML

前端之家收集整理的这篇文章主要介绍了jQuery UI Datepicker – 如何更改Datepicker HTML前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我需要对由jQuery UI Datepicker生成的Datepicker HTML进行一些简单的更改.在日历表之后添加一些简短的文本.

我一直在尝试使用beforeShow事件,但是当我可以访问当前的HTML使用它,操纵它不起作用:

beforeShow: function(input,inst) {
//#this works
alert($('#ui-datepicker-div').html());
//#this does nothing
$('#ui-datepicker-div').append('message');          
}

我认为这可能是因为Datepicker HTML元素后来被添加到Dom,因此需要实时方法来更新HTML,但是我不知道如何使用这个函数回调来连接live方法.或者我完全可以以错误的方式接近这个.

我真的很感激,如果有人可以帮助我,因为我已经搜索和尝试了很多事情,但我似乎无法让这个工作.谢谢.

解决方法

看来你需要等到.ui-datepicker-calendar表插入#ui-datepicker-div来附加你的消息.你可以做一个计时器来检查:
$('#datepicker').datepicker({
    beforeShow: function(input,inst) {
        insertMessage();
    }
});

// listen to the Prev and Next buttons
$('#ui-datepicker-div').delegate('.ui-datepicker-prev,.ui-datepicker-next','click',insertMessage);

function insertMessage() {
    clearTimeout(insertMessage.timer);

    if ($('#ui-datepicker-div .ui-datepicker-calendar').is(':visible'))
        $('#ui-datepicker-div').append('<div>foo</div>');
    else
        insertMessage.timer = setTimeout(insertMessage,10);
}

看到它在行动:http://jsfiddle.net/william/M9Z7T/2/.

看到它在行动:http://jsfiddle.net/M9Z7T/126/.

猜你在找的jQuery相关文章