0

私のhtmlには、2つの異なるdiv内に2つの異なるdatepickerがあります。日付ピッカーから日を選択するときに、次のように何かをしたいと思います。

$('#details1 tr .ui-body-c').on('click', function(){
    $('#details1 .hasDatepicker').hide();
    if($('#date1').val()!="")
    {
        var day=new Date($('#date1').val());
        day.setHours(23);
        day.setMinutes(59);
        day.setSeconds(59);

        getDayData(day);
    }
});

ただし、その日をクリックしても、クリックイベントはトリガーされません。セレクターから#details1を削除すると、イベントがトリガーされますが、両方の日付ピッカーが使用されます。

datepickerプラグインへのリンクは次のとおりです:http://jquerymobile.com/demos/1.0a4.1/experiments/ui-datepicker/

編集: jquery-mobiledatepickerが作成するテーブルがページ内で検出されていないようです。私もこれを試しました:

$('html tr .ui-body-c').on('click', function(){
   $('#details1 .hasDatepicker').hide();
    if($('#date1').val()!="")
    {
        var day=new Date($('#date1').val());
        day.setHours(23);
        day.setMinutes(59);
        day.setSeconds(59);

        getDayData(day);
    }
});

そして、動作していません。var a = $('.datepicker-calendar').parent()結果として[]も取得しました。

なぜこれが起こっているのか、そしてそれをどのように解決するのかについて何か考えはありますか?

4

2 に答える 2

1

編集:申し訳ありませんが、datepickerのモバイルバージョンが何をするのかを詳しく調べる必要がありました。問題は、後でDOMにテーブルを追加することが原因である可能性があります。静的なものからイベントを委任する必要があります。例:

$('#details1').on('click', 'tr .ui-body-c', function(){

モバイルバージョンのdatepickerが通常のjQueryUIと同じである場合は、最初に初期化するときにonSelectイベントを使用することをお勧めします。

$('#details1').datepicker({
    onSelect: function(dateText, inst) {
        inst.input.hide();
        var day=new Date(dateText);
        day.setHours(23);
        day.setMinutes(59);
        day.setSeconds(59);

        getDayData(day);
    }
});​

このイベントは、日を選択するとトリガーされます。dateTextは入力に入力する値であり(自分で取得する必要はありません)、instは問題の入力(inst.input)を含むdatepickerインスタンスです。

于 2012-07-18T14:27:10.767 に答える
0

ファイルを編集し、jquery.ui.datepicker.mobile.js要素にカスタムクラスを追加することで、これを回避しました。

if(options.altField!=undefined)
    $(dp).attr('id', options.altField.split('#')[1] + '1');

そして、function updateDatepicker(){

$( ".ui-datepicker-calendar td", dp ).addClass("ui-body-c "+$(dp).attr('id')+'2');

したがって、日付入力のIDが "myDatePicker"の場合、カレンダーの各tdにはクラス "myDatePicker12"があり、これを行うことができます。

$('.myDatePicker12').on('click', function(){
   $('#details1 .hasDatepicker').hide();
    if($('#date1').val()!="")
    {
        var day=new Date($('#date1').val());
        day.setHours(23);
        day.setMinutes(59);
        day.setSeconds(59);

        getDayData(day);
    }
});
于 2012-07-19T08:51:53.200 に答える