无法 select 对象不是初始 DOM 的一部分

Question

当用户点击 '.acceptExtra':

时，我使用 .html() 方法用 jQuery 动态插入了一段 HTML

HTML:

<div class="tripleButtonsWrap">
   <div class="tripleButtonsC">
        <div class="acceptExtra">
        ............
        </div>
   </div>
</div>

jQuery:

$(document).on('click','.acceptExtra', function(){
            closeExtras();
    });

function closeExtras(){            
    $(document).find('.tripleButtonsC').fadeOut(400,function(){
        $(this).remove();
        $('.tripleButtonsWrap').html(initialCode); //HTML PIECE INSERTED
        $(document).find('.tripleButtonsC').fadeIn(600);   
    }); 
}

initialCode 变量存储包含“.acceptExtra”按钮的 HTML，并且当它被委托 (on('click','.acceptExtra', function()...) 调用时，它一次又一次地正常工作。

但是 '.tripleButtonsC' 只会在第一次执行 closeExtras() 时淡出。下次它不会被 jQuery 识别，因此整个 closeExtras() 函数不适用。

我尝试使用 $(document).find('.tripleButtonsC')... 选择它，但没有结果。

如何让它再次被jQuery选中？

Answer 1

我想这就是它不起作用的原因：
在执行函数之前，你有这个 dom:

<div class="tripleButtonsWrap">
   <div class="tripleButtonsC">
        <div class="acceptExtra">
        ............
        </div>
   </div>
</div>

但是在执行 closeExtras 函数 ( ('.tripleButtonsWrap').html(initialCode); ) 之后你会得到这个 dom:

<div class="tripleButtonsWrap">
     <div class="acceptExtra">
        ............
      </div>
</div>

因为initialCode变量不包含div和classtripleButtonsC。

为确保 div 和 class tripleButtonsC 不存在，请使用 google 开发人员工具检查您的 html。

无法 select 对象不是初始 DOM 的一部分

Unable to select object not part of the initial DOM

jquery

javascript-objects