【问题标题】:JQuery widget: setting context in sub-widgetJQuery 小部件:在子小部件中设置上下文
【发布时间】:2013-11-01 10:52:56
【问题描述】:

我有一个小部件,它基本上在元素上创建一个 JQuery 日期选择器,然后处理从 Web 服务检索数据并根据返回的数据启用/禁用日期。

小部件的定义如下 - 一些简单的默认选项:

$.widget("XXXX.CalendarBooking", {
    options: {
    minDaysInAdvance: 0,
    maxDaysInAdvance: 0,
    productNumber: '',
    url: '',
    numberOfDays: 40
},
...

构造函数如下所示,它在元素上创建日期选择器,然后设置检索数据和处理(启用)日期的函数:

_create: function () {
    this.element.datepicker({
        dateFormat: 'dd MM yy',
        firstDay: 1,
        minDate: this.options.minDaysInAdvance,
        maxDate: this.options.maxDaysInAdvance,
        beforeShowDay: this._processDate,
        onChangeMonthYear: this._changeMonthYear
    });
    ...

processdate 函数如下所示:

_processDate: function (date) {
    // get availability
    if (!this._availability) {
    $.ajax({
        async: false,
        type: "POST",
        contentType: "application/json; charset=utf-8",
        url: this.options.url,
        data: '{ productNumber: "' + this.options.productNumber + '", startDate: "' + date.toJSON() + '", numberOfDays: ' + numberOfDays + ' }',
        dataType: "json",
        success: function (msg) {
            _setAvailability(msg.d);
        },
        error: function (xhr, ajaxOptions, thrownError) {
            _setAvailability('error');
        }
    });
}

但是,当调用 processdate 时,上下文不在小部件中,因此我无权访问这些选项。我这样做是否正确,或者有没有办法重载 processdate 函数,以便在为 beforeShowDay 设置回调时,我可以传入选项,它不会覆盖 JQuery 将传递给该函数的日期值?

【问题讨论】:

    标签: javascript jquery datepicker closures jquery-widgets


    【解决方案1】:

    您可以使用$.proxy 设置调用函数的上下文。试试这个:

    beforeShowDay: $.proxy(this._processDate, this),
    

    现在,在您的 _processDate 函数中,this 关键字将引用您的小部件。您可以使用 this.element 访问引发事件的元素。

    【讨论】:

    • 是的,这就是我需要的。谢谢!
    • @Sean 没问题,很高兴为您提供帮助。 $.proxy 在制作小部件和插件时绝对是无价的:)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2019-06-26
    • 2013-02-23
    • 2016-08-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多