javascript - 在 .load() 内容上运行 JS 函数

Question

我有一个名为 timepicker 的函数，通常通过使用调用

$(document).ready(function() {
        $('#timepicker').timepicker();
});

但我无法使其适用于使用 jQuery .load() 显示的内容。

我尝试了多种方法，包括使用以下方法，但没有任何反应？

$(document).ready(function() {
        var $parent = $('#small_container');
        var time = $parent.find('#timepicker');
        time.timepicker();
});

#small_container 是内容加载到的 DIV 的 ID，#timepicker 是在加载时应调用该函数的输入的 ID点击。

我是否已将其添加到回调中的正确位置？

$('.edit_job').on("click", function(){
    var week_start = $('input[name=week_start]').val();
    var job_id_del= $('input[name=job_id]').val();
    var user_id = $('input[name=user_id]').val();
    $('#small_container').load('ajax/edit_weekly_job_load.php?job_id='+job_id_del+'&week_start='+week_start+"&user="+user_id);
    $('#timepicker').timepicker();
    $('#small_container').on("click", '#edit_job_submit', function(){
          jQuery.ajax({
              type: "POST",
              url: "ajax/edit_weekly_job_ajax.php",
              dataType: "json",
              data: $('#edit_job_form').serialize(),
              success: function(response){
                  if(response.success === 'success'){
                    window.opener.$("#diary").load("ajax/diary_weekly_load.php?week_start="+week_start+"&user="+user_id);
                    window.close();
                }
              },
        });//end ajax
    });//save_job_edit_submit
});//end edit job

Answer 1

内容异步加载到元素#small_container。在实际加载内容之前调用 timepicker 函数。尝试在load()方法的回调中调用该函数: $('#small_container').load('ajax/edit_weekly_job_load.php?job_id='+job_id_del+'&week_start='+week_start+"&user="+user_id ,function(){ $('#timepicker').timepicker(); } );

还要验证元素 #timepicker 实际上已附加到元素 #small_container。