jquery - jQuery wrap() 在 on()

Question

我正在使用以下代码来包装复选框。

$('input[type="checkbox"]').wrap('<div class="checkableBox"/>');

这在第一页上运行良好，但每当使用 AJAX 从数据库加载一些新复选框时，它就会停止包装它们。

那么如何在这里使用 jQuery on() 来防止 aobe 问题呢？还是有其他方法可以解决这个问题？

问候

Answer 1

在ajax成功中再次调用它

$.ajax({
    success:function(){
        $('input[type="checkbox"]').each(function(){
            if(!$(this).parent().is('.checkableBox'))
            {
                $(this).wrap('<div class="checkableBox" />');
            }
        });
    }
});

Answer 2

那是因为当您第一次调用它时，“额外”元素不是 DOM 的一部分。将代码放入函数中：

function wrapChecks(){
   $('input[type="checkbox"]').wrap('<div class="checkableBox"/>');

}

然后在页面加载时调用此函数，然后在 ajax 回调中再次调用。

Answer 3

您是否在 ajax 更新到页面后调用 jquery 函数来执行此命令？如果没有，你应该这样做。
正如 Jose 建议的那样，将 wrap 放在一个函数中。
一次，ajax 查询将额外的复选框加载到网站中，执行检查（例如：父 div 的 .change() 事件，如果尚未包装新数据，则调用该函数将新数据包装在其中。）
你可以使用.parent()函数来检查父 div 是否为“复选框”。如果不是，则用 div checkablebox 包裹新加载的复选框。