Question

我是twitter bootstrap第3版的新手，并从link获取示例。

这里想要从n个重复次数中设置n个日期范围。

它正常工作。

但是当它被动态使用时，它无法正常工作。

我使用的代码是

     var number_of_repetitions = text;
                         var container = $('#date_list');

if (number_of_repetitions > numItems) {
                             for (var i = numItems + 1; i <= number_of_repetitions; i++)
                             $('<div class="well">'
   +'<div class="form-group">'
     + '<label for="inputPassword" class="col-sm-5 control-label">Enter Date Range Text ' + i + '</label>'
     +' <div class="col-sm-4">'
         +'<input class="form-control"   id="text_' + i + '" type="text" />'
      +'</div>'
 +' </div>'
   +'<div class="container">'
      +'<div class="col-sm-3"> </div>'
      +'<div class="col-sm-9" style="height:75px;">'
         +'<div class="col-md-6">'
            +'<div class="form-group">'
              +' <label for="inputPassword" class="col-sm-3 control-label">From</label>'
               +'<div class="input-group date form_date col-md-5" data-date="" data-date-format="yyyy-mm-dd" data-link-field="from' + i + '" data-link-format="yyyy-mm-dd">'
                  +'<input class="form-control"  size="14" type="text" value=""  >'
                 + '<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>'
               +'</div>'
               +'<input type="hidden" id="from' + i + '" value="" /><br/>'
            +'</div>'
        + '</div>'
         +'<div class="col-md-6">'
            +'<div class="form-group">'
              + '<label for="inputPassword" class="col-sm-3 control-label">To</label>'
               +'<div class="input-group date form_date col-md-5" data-date="" data-date-format="yyyy-mm-dd" data-link-field="dtp_input7" data-link-format="yyyy-mm-dd">'
                  +'<input id="acpro_inp1" class="form-control"  size="14" type="text" value=""  >'
                  +'<span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span></span>'
               +'</div>'
               +'<input type="hidden" id="dtp_input7" value="" /><br/>'
            +'</div>'
        + '</div>'
      +'</div>'
   +'</div>'
+'</div>').click(function() {

                             }).appendTo(container);
                         }
                     }

Answer 1

以dinamically方式添加它，您应该调用HTML事件的方法来告诉Date Picker处理这些元素。如果您看到example (of the link)，则会有一个包含以下代码的脚本：

$('#datetimepicker7').datetimepicker({
    defaultDate: "11/1/13",
    disabledDates: [
        moment("12/25/2013"),
        new Date(2013, 11 - 1, 21),
        "11/22/2013 00:53"
     ]
});

$("#datetimepicker7")是日期时间选择器将在其上工作的元素。回到你的代码后，在追加这个HTML之后（在.appendTo(container);之后），你应该在你想要使用插件的HTML元素中调用.datetimepicker()（我想要使用类'form_date'的元素）。一个例子可能是：$(".form_date").datetimepicker();

如果您需要以默认日期开始，可以使用对象'defaultDate'添加参数，如link example中的参数。示例：$(".form_date").datetimepicker({defaultDate: "2/2/14"});

我希望我帮助过：）

为什么动态引导版本3日期选择器不起作用？

1 个答案: