Question

这样的演示和完整代码：

我希望第一次加载时没有填写datepicker和timepicker。我希望当用户点击每个的输入文本时填充datepicker或timepicker。例如，用户点击时间戳文本输入，然后将填写时间

我尝试使用它：

  $('#datepicker').val("");
  $('#timepicker').val("");

但它不起作用

我该怎么做？

Answer 1

你找到了正确的伎俩！

$('#datepicker').val("");
$('#timepicker').val("");

但你不是在适当的时候做的。放置拾取器后的位置。

要填充焦点时间，请将此.on()添加到timepicker：

$('#timepicker').datetimepicker({
  minDate: moment().add(300, 'm'),
})
  .on('focus', function(e){
  if( $(this).val() == "" ){
    $(this).data("DateTimePicker").minDate(moment().add(300, 'm'));
  }
});

Fiddle

Answer 2

您只需要将这些行写到函数的末尾：

$('#datepicker').val("");
$('#timepicker').val("");

您可以使用此代码：

$(function () {
  console.clear();

  $('#datepicker').datetimepicker({
    minDate: moment().add(300, 'm').startOf("day")
  })
    .val(moment().add(300, 'm').format("DD-MM-YYYY"))   // To set correct "valid" date from start

    .on('dp.change', function(e){
    var now = moment().format("X");
    //console.log(e.date.format("X"));
    //console.log(now);

    // Comparing selected date (moment object) in milliseconds
    if(e.date.format("X")+(300*60*1000) > now ){
      console.log("above 5 hours, unlocking time.");
      $('#timepicker').data("DateTimePicker").minDate(false);
    }else{
      console.log("below 5 hours, locking time (and probably resetting the value to min...)");
      $('#timepicker').data("DateTimePicker").minDate(moment().add(300, 'm'));
    }

  });

  $('#timepicker').datetimepicker({
    minDate: moment().add(300, 'm'),
  });

  $('#datepicker').val("");
  $('#timepicker').val("");
});

Answer 3

看看这个小提琴https://jsfiddle.net/lamp03/yfjvd200/9/。我评论了一些行

$(function () {
  //$('#datepicker').val("");
  //$('#timepicker').val("");
  console.clear();

  $('#datepicker').datetimepicker({
    minDate: moment().add(300, 'm').startOf("day")
  })
    //.val(moment().add(300, 'm').format("DD-MM-YYYY"))   // To set correct "valid" date from start

    .on('dp.change', function(e){
    var now = moment().format("X");
    //console.log(e.date.format("X"));
    //console.log(now);

    // Comparing selected date (moment object) in milliseconds
    if(e.date.format("X")+(300*60*1000) > now ){
      console.log("above 5 hours, unlocking time.");
      $('#timepicker').data("DateTimePicker").minDate(false);
    }else{
      console.log("below 5 hours, locking time (and probably resetting the value to min...)");
      $('#timepicker').data("DateTimePicker").minDate(moment().add(300, 'm'));
    }

  });

  $('#timepicker').datetimepicker({
    //minDate: moment().add(300, 'm'),
  }).on('dp.change', function(e){ $('#timepicker').data("DateTimePicker").minDate(moment().add(300, 'm'));});
});

如何在datetimepicker上清除输入文本？

3 个答案: