0

我在父页面中有一个 div,它通过对 HTML 的 AJAX 调用填充了 HTML 和 Javascript。

加载的 Javascript 将“更改”事件绑定到加载的 HTML 中的元素。

在第一次 AJAX 调用之后,事件总是会触发。但是,在随后的 AJAX 调用中,它永远不会这样做。

父页面本身填充到祖父页面上的 div 中。在子页面被填充到父页面的 div 之前,父页面通过对 HTML 的不同 AJAX 调用填充到祖父页面的 div 中。不确定这是否与我的问题有关。

在绑定事件之前调用对象上的 .off() (使用 .on)根本没有帮助。

这是元素:

    <select id="groupSelection" name="grouping" style="width:275px;">
        <option value="0" selected>No Grouping - Single Creative Ad Unit</option>
        <option value="1">New Creative Group</option>
        <?php foreach($placementGroups as $placementGroup): ?>
        <option value="<?=$placementGroup->get_id()?>" data-height="<?=$placementGroup->get_height()?>" data-width="<?=$placementGroup->get_width()?>"><?=$placementGroup->get_name()?> - Height: <?=$placementGroup->get_height()?>px x Width: <?=$placementGroup->get_width()?>px</option>
        <?php endforeach;?>
    </select>

这是绑定事件:

    $('#groupSelection').off().on('change', function() {...});

但是,如果我在第二个 AJAX 调用之后显式调用 $('#groupSelection').change() ,它就会触发。

我需要做什么?谢谢

编辑:

在我的代码中有一个地方,孩子调用了 ajax 函数,它不仅会重新加载自身,还会重新加载其父函数。当我在调用 ajax 函数之前调用 $('#groupSelection').off() 时,它工作正常。

但是,父级中的某些函数也会重新加载子级。当我在其中一个函数中重新加载孩子之前调用 $('#groupSelection').off() 时,我仍然遇到同样的问题。

4

2 回答 2

0

如果您的 AJAX 调用将元素替换为groupSelectionid,则需要重新创建事件处理程序。不需要重新创建事件处理程序的另一种格式是:

$('#someElementWhichIsNotReplacedWhichIsAParentOfgroupSelection').on('change', '#groupSelection', someFunc);
于 2013-10-24T20:53:17.933 回答
0

似乎唯一可行的是如果我这样做 $('#groupSelection').remove(); 在从父级进行 ajax 调用之前,我必须在每个进行 AJAX 调用的父函数中执行此操作(ajax 调用位于无法修改的库函数中)。这对我来说似乎是一个丑陋的解决方案,想要一个更漂亮的解决方案。

我试了一下,因为我意识到 $("select[id='groupSelection']").length 每次调用 ajax 时都会增加。是否有一种干净的方法来垃圾收集内存中的所有事件和对象,以便在 div 中替换 HTML?这上面写满了内存泄漏。

编辑:

在父 div 上调用 .empty() 不会删除元素。仅对它们中的每一个显式调用 .remove() 。

于 2013-10-24T23:32:21.500 回答