$("#datePicker").datepicker("getDate").getMonth不是函数

Question

尝试通过指向特定月份的链接来帮助实现此功能

http://jquerymobile.com/test/experiments/ui-datepicker/

我试过这个

http://jsfiddle.net/mplungjan/FQLjS/2/

1. 默认日期不是六月的第一天
2. 我有一个可见的日历和另一个onclick.
3. 我明白了

错误:$("#datePicker").datepicker("getDate").getMonth不是函数
源文件:http://fiddle.jshell.net/mplungjan/FQLjS/2/show/
行:59

这有什么问题？

请注意移动jquery和移动日期选择器添加的资源

Answer 1

问题是由于jquery.ui.datepicker.mobile.js,无论你从中获得了什么,这显然是一个不完整的黑客.

真正的问题在于这条线:

//return jqm obj 
return this;

这意味着无论你调用什么,它总会返回新的datepicker的被黑客攻击的jQuery对象.在您的情况下,它应该返回一个日期.

一个解决方案,再次只是一个hack,是保存原始datepicker调用的返回值,并且只有在原始返回值实际上是jQuery对象时才返回jQuery对象:

...

//call cached datepicker plugin
var retValue = prevDp.call( this, options );

...

//return jqm obj
if(retValue){
    if(!retValue.jquery) return retValue;
}
return this;

...

编辑:此扩展扩展的进一步问题是它会破坏需要多个参数的所有命令.该datepicker()可以多达5个参数,所以这些演员必须通过原来的分机通过.

同样,添加额外的样式和click事件的绑定只应在构造datepicker时进行,因此需要进行额外的检查以查看第一个参数的类型是字符串还是不.

生成的代码看起来应该是这样的,我将其余部分留给最初的开发人员:).

(function($, undefined ) {

    //cache previous datepicker ui method
    var prevDp = $.fn.datepicker;

    //rewrite datepicker
    $.fn.datepicker = function( options, param2, param3, param4, param5 ){

        var dp = this;

        //call cached datepicker plugin
        var retValue = prevDp.call( this, options, param2, param3, param4, param5 );

        //extend with some dom manipulation to update the markup for jQM
        //call immediately
        function updateDatepicker(){
            $( ".ui-datepicker-header", dp ).addClass("ui-body-c ui-corner-top").removeClass("ui-corner-all");
            $( ".ui-datepicker-prev, .ui-datepicker-next", dp ).attr("href", "#");
            $( ".ui-datepicker-prev", dp ).buttonMarkup({iconpos: "notext", icon: "arrow-l", shadow: true, corners: true});
            $( ".ui-datepicker-next", dp ).buttonMarkup({iconpos: "notext", icon: "arrow-r", shadow: true, corners: true});
            $( ".ui-datepicker-calendar th", dp ).addClass("ui-bar-c");
            $( ".ui-datepicker-calendar td", dp ).addClass("ui-body-c");
            $( ".ui-datepicker-calendar a", dp ).buttonMarkup({corners: false, shadow: false}); 
            $( ".ui-datepicker-calendar a.ui-state-active", dp ).addClass("ui-btn-active"); // selected date
            $( ".ui-datepicker-calendar a.ui-state-highlight", dp ).addClass("ui-btn-up-e"); // today"s date
            $( ".ui-datepicker-calendar .ui-btn", dp ).each(function(){
                var el = $(this);
                // remove extra button markup - necessary for date value to be interpreted correctly
                el.html( el.find( ".ui-btn-text" ).text() ); 
            });
        };

        if(typeof options != 'string'){
            //update now
            updateDatepicker();

            // and on click
            $( dp ).click( updateDatepicker );
        }

        //return jqm obj 
        if(retValue){
            if(!retValue.jquery) return retValue;
        }
        return this;
    };

    //bind to pagecreate to automatically enhance date inputs   
    $( ".ui-page" ).live( "pagecreate", function(){     
        $( "input[type='date'], input:jqmData(type='date')", this ).each(function(){
            $(this).after( $( "<div />" ).datepicker({ altField: "#" + $(this).attr( "id" ), showOtherMonths: true }) );
        }); 
    });
})( jQuery );