Javascript 在DateBox Jquery Mobile中动态设置日期和时间

我需要动态地将日期和时间填充到JQuery数据框输入字段。我本想这样做，但不管我传递的数据是什么，它都会在输入字段中填充当前日期

这是我正在克隆的日期选择器，它动态地存在于我的界面中

Html:-

<input class="time-input day-time-picker day-time-picker-inline-input"  type="text" data-role="datebox" data-options='{"mode":"datebox", "useFocus": true}' style="width:8em" />

类似的方法，我创建了一个时间选择器，并像上面那样进行了克隆

Html:-

var timePicker = $("#time-picker-template-container .time-picker-template").clone();

Javascript:-

<input class="time-input day-time-picker day-time-picker-inline-input" type="text" data-role="datebox" data-options='{"mode":"timebox", "useFocus": true}' />

插入时间

$(".time-input",  dayTimePicker).datebox();

 $(".time-input",  dayTimePicker).datebox("refresh");

 $(".time-input",  dayTimePicker).val('datebox', {'method':'set', 'value':dynamicTime});

我想根据收到的响应动态设置这些日期框输入字段的日期和时间

是否有任何控件可以使用DateBox在单个控件中获取日期和时间

---

谢谢。

克隆模板，将它们添加到容器DOM元素中，然后告诉该元素enhanceWithin（）。这将创建数据框小部件，然后使用setTheDate方法设置日期和时间：

$("#btnAdd").on("click", function(){
    var dynamicDate = new Date(2014,3,22,10,11,0,0);

    var datePicker = $("#templates .date-time-picker-template").clone();
    var dayTimePicker = $("#templates .time-picker-template").clone();
    $("#time-picker-block").append(datePicker).append(dayTimePicker).enhanceWithin(); 

    $(".date-input",  datePicker).datebox('setTheDate', dynamicDate);
    $(".time-input",  dayTimePicker).datebox('setTheDate', dynamicDate);
});

---

我不确定我是否遵循了您试图实现的目标，但是，是的，有一种模式允许同时进行日期和时间操作—slidebox

您需要设置（至少）以下选项：

{
  mode = "slidebox",
  overrideSlideFieldOrder = ["y","m","d","h","i"],
  overrideDateFormat = "%Y-%m-%d %k:%M
}

---

不管它值多少钱，flipbox可能会被修改为两者都可以使用，但这并不是一件小事。datebox可能已经可以工作了（我从未尝试过），但您需要对CSS进行大量修改-至少首先要使控件更宽。

您在代码中在哪里设置了datebox的值？克隆将忽略值字段。已编辑问题。现在它有了插入日期和时间的代码。克隆将不保留该值？不，它将不保留。所以你必须在克隆后设置值，但我也只是在克隆后设置值。但它仍然显示的是当前日期，而不是设定日期。我能知道任何可能的方法使它正确，以便我可以尝试前进吗

$("#btnAdd").on("click", function(){
    var dynamicDate = new Date(2014,3,22,10,11,0,0);

    var datePicker = $("#templates .date-time-picker-template").clone();
    var dayTimePicker = $("#templates .time-picker-template").clone();
    $("#time-picker-block").append(datePicker).append(dayTimePicker).enhanceWithin(); 

    $(".date-input",  datePicker).datebox('setTheDate', dynamicDate);
    $(".time-input",  dayTimePicker).datebox('setTheDate', dynamicDate);
});

{
  mode = "slidebox",
  overrideSlideFieldOrder = ["y","m","d","h","i"],
  overrideDateFormat = "%Y-%m-%d %k:%M
}