JEasyUI를 사용하여 DateTimeBox 및 TimeSpinner에서 실제 JavaScript Date를 얻는 방법은 무엇입니까?

Question

간단한 HTML 코드가 변경시기에 대한 그들에

<div class="easyui-datebox" style="width:250px;height:30px;"></div> 
<div class="easyui-calendar" style="width:250px;height:250px;"></div> 
<div class="easyui-timespinner" style="width:250px;height:30px;"></div> 
<div class="easyui-datetimebox" style="width:250px;height:30px;"></div> 

콜백 기능, datebox와

function setText(raw, parser) { 
    var date = ''; 
    if(parser) { 
    try{ 
     date = parser(raw); 
    } 
    catch(e) { 
     date = e; 
    } 
    } 

    $('.easyui-textbox').textbox(
    'setText', 
     'Raw: ' + raw + ', Parsed: ' + date + '\n' + $('.easyui-textbox').textbox('getText')); 
} 

$('.easyui-datebox').datebox({ 
    onChange: function(newVal) { 
    setText(newVal, $.fn.datebox.defaults.parser); 
    } 
}); 

$('.easyui-timespinner').timespinner({ 
    onChange: function(newVal) { 
    setText(newVal, $.fn.timespinner.defaults.parser); 
    } 
}); 

$('.easyui-datetimebox').datetimebox({ 
    onChange: function(newVal) { 
    setText(newVal, $.fn.datetimebox.defaults.parser); 
    } 
}); 

$('.easyui-calendar').calendar({ 
    onChange: function(newVal) { 
    setText(newVal); 
    } 
}); 

, 예상대로의 $.fn.datebox.defaults.parser 작품, calendar와 함께, 당신을 위해 작업을 수행하고, 이미 current 속성뿐만 아니라 콜백 날짜입니다.

그러나 모두 datetimebox와

및 timespinner, 우리는

TypeError: $.data(...) is undefined 

문서는 여기 크지 않다, jquery.easyui.min.js에 모호한 오류가 발생, 나는 핸들을 얻을 수 EasyUI의 압축되지 않은 버전을 찾을 수 없습니다 파서에서 정확히 무슨 일이 일어나는지. 제목이 간다

그래서, 어떻게 Calendar과 DateBox 함께 얻을 수 있어요처럼 TimeSpinner 내가 EasyUI의 DateTimeBox에서 실제 날짜를받을 수 있나요, 그리고?

Answer 1

아직 압축되어 있지만 jquery.easyui.min.js의 소스를 보면 문제가 무엇인지 알 수 있습니다. 이유가 무엇이든간에 (나는 그것이 버그라고 가정 할 것임), DateTimeBox과 TimeSpinner의 파서는 $(this) 코드를 사용하는데,이 코드는 적절한 문맥에서는 괜찮지 만, "static"방식으로 함수를 호출하는 것은 $.fn.datetimebox.defaults.parser(...), this과 같습니다. 문맥은 입니다.this입니다. Javascript 개체이며, 예상되는 개체는 HTML DOM입니다.

var _bd1=$(this).datetimebox("spinner").timespinner("options").separator; 

및

var opts=$(this).timespinner("options"); 

는 잘못된 라인이다.

이 문제를 해결하려면 호출 된 함수의 컨텍스트를 설정할 수있는 Java의 call 메서드 접근자를 사용해야합니다.

그래서

, 대신 $의 .fn.datetimebox.defaults.parser (된 newval)

$.fn.datetimebox.defaults.parser.call(this, newVal) 

그리고 대신 $의 .fn.timespinner.defaults.parser (된 newval)

$.fn.timespinner.defaults.parser.call(this, newVal) 

이렇게하면 내부 함수가 this에 액세스 할 때 this이 전달됩니다. 에서 그 변화

업데이트 JSFiddle 예,

https://jsfiddle.net/7pm89dp7/1/ 이제

, 나에게이 여전히 성가신 것, 그리고 내 직감이 작업을 수행하려면 다른 더 좋은 방법이있을 나에게 말한다, 그러나 나는 확실히 할 수 하나 찾지 마!