如何在ajax调用后获取动态加载的元素进行初始化？答案

【问题标题】：How to get dynamically loaded elements to initialize after an ajax call?如何在ajax调用后获取动态加载的元素进行初始化？
【发布时间】：2015-08-10 03:50:58
【问题描述】：

我使用 numericstepper.js 作为我的输入文本框微调器。当我有以下代码时它可以工作。

<script src="<?= site_url('assets/js/numericstepper.js') ?>"></script>
<script>
$('.continue-participation-btn').click(function(e) {
  e.preventDefault();
  var $form = $('form[name="apr-grade-participation-form"]').serialize();
  $.ajax({
    url: '/ajax/continue_participation',
    type: 'POST',
    data: $form,
    success: function(res) {
      if (res) {
        $('.continuous-section').html(res);
        $('html, body').animate({
          scrollTop: 0
        }, 900, function() {
          $('.participation').removeClass('visible').addClass('completed-section');
          $('.continuous-section').addClass('visible');
        });
      } else {
        alert('Unable to process request');
      }
    }
  });
});
</script>

<label for="">Number of Students</label>
<span class="numeric-stepper" style="display: block;"> 
    <input size="2" class="number-of-day-input" id="day_<?=$part_count;?>" name="partdetail_pk_5[<?=$part_count;?>][day]" type="text" placeholder="000" pattern="[0-9]*" value="">
    <button type="button" name="ns_button_1" maxValue = 999 value="1" class="plus">+</button>
    <button type="button" name="ns_button_2" value="-1" class="minus">-</button>
 </span>

但是，当我使用 Ajax 加载带有输入微调器文本框的页面时，它不起作用。有人有解决这个问题的想法吗？谢谢

【问题讨论】：

感谢塞缪尔编辑我的问题。我是 stackoverflow 的新手.. :)
您能否分享请求并将此内容插入页面的代码？是否发生任何错误？对于一些一般猜测：Can scripts be inserted with innerHTML? 和/或Why does jQuery or a DOM method such as getElementById not find the element?

标签： javascript php jquery ajax jquery-plugins

【解决方案1】：

您需要在 ajax 调用的成功函数中调用 $('.numeric-stepper').stepper(); 来初始化新的微调器。

$.ajax({
    // other ajax options ...

    success: function(res) {
        if (res) {
            $('.numeric-stepper').stepper();

        ...

【讨论】：

在我添加后 $('.numeric').stepper();我收到“未捕获的类型错误：$(...).stepper 不是函数”错误
找出我需要调用 numberstepper.js 中的 initNumericStepper( ) 来重新加载它。
很抱歉给您带来了困惑。但是您的回答使我考虑重新加载功能。感谢您的所有帮助。