從AJAX生成的控件調用在我的頁面中不起作用

Question

在這里陷入僵局，放棄……有人可以幫忙嗎？

這是一些AJAX生成的HTML代碼的示例：

<div class='input-group date form_datetime col-sm-6' data-link-field='stime'>
  <input type='text' readonly name='stime' class='form-control' style='width:220;' value='" & rs("time") & "'>
  <span class='input-group-addon'><span class='glyphicon glyphicon-remove'></span></span>
  <span class='input-group-addon'><span class='glyphicon glyphicon-calendar' tabindex='3'></span></span>
</div>

..這是我從上面生成的HTML到原始頁面上的JQuery的調用...

<script type="text/javascript">
  $('.form_datetime').on 'focus', $(this).datetimepicker({
    weekStart: 1,
    todayBtn:  1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
    showMeridian: 1,
    format: 'mm/dd/yyyy HH:ii P',
    startDate: new Date
  });
</script>

...這是我要求提供的數據...

function loadSlot(id) {
  var xmlhttp;    
  if (window.XMLHttpRequest) {
    xmlhttp=new XMLHttpRequest();
  } else {
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
  xmlhttp.onreadystatechange=function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
      document.getElementById("dataSlot").innerHTML=xmlhttp.responseText;
    }
  }
  xmlhttp.open("GET","getslots.asp?id="+id,true);
  xmlhttp.send();
}

我單擊記錄，它將數據正確加載到我的頁面中，其中一個字段是datetime字段，我單擊按鈕以引發datetimepicker，然后...什么也沒有....但是-任何直接加載的datetimepicker在我的原始頁面上工作正常。

有任何想法嗎？

PS-如果您還沒猜到，我是AJAX的新手。...:)

先感謝您！

Answer 1

委托事件，以便新添加的元素綁定事件：

<script type="text/javascript">
 $(document).on('focus', '.form_datetime', function () {
    $(this).datetimepicker({
        weekStart: 1,
        todayBtn: 1,
        autoclose: 1,
        todayHighlight: 1,
        startView: 2,
        forceParse: 0,
        showMeridian: 1,
        format: 'mm/dd/yyyy HH:ii P',
        startDate: new Date
    });
 });
</script>