Javascript Jquery没有'；t在表中以数字方式创建的元素中正确加载

我使用datatables.net和boostrap在图像上显示悬停效果。 扩展表内的图像必须与表外的图像工作相同，无法找到其不工作的原因：

时间线
.缩略图{
位置：相对位置；
溢出：隐藏；
}
.标题{
位置：绝对位置；
排名：0；
右：0；
背景：rgba（66,139,202,0.75）；
宽度：100%；
身高：100%；
填充：2%；
显示：无；
文本对齐：居中；
颜色：#fff！重要；
z指数：2；
}
img{
最大高度：无；
最小高度：0；
}
td.1电子控制{
背景：url（'https://www.datatables.net/examples/resources/details_open.png“）无重复中心；
光标：指针；
}
tr.所示td.详细信息-控制{
背景：url（'https://www.datatables.net/examples/resources/details_close.png“）无重复中心；
}
帕瓦迪尼马斯
安特拉štė
提帕斯
Išsiuntimo/gavimo数据
资料
多库曼托。
Dokumentas.doc


Dokumentas.doc


/*行详细信息的格式化功能-根据需要进行修改*/
函数格式（d）{
//`d`是该行的原始数据对象
返回“”+
''+
“Dokumentai:&160；”+
''+
''+
''+
“+d.dokumentai+”
“”+
“
”+
''+
''+
''+
''+ 
''+
'';
}
$（文档）.ready（函数（）{
变量表=$（“#表”）。数据表（{
“订单”：[[3，“说明”]，
“分页”：false，
“搜索”：错误，
“数据”：[
{
“帕瓦迪尼马斯”：“假装，雷卡拉维迈·比乌鲁伊”，
“antraste”：“Dėl išmokos”，
“tipas”：“高塔”，
“siunt_gav_数据”：“2015/08/24”，
“数据”：“2011/04/25”，
“dok_nr”：“G00-100”，
“dokumentai”：“dokumentas.doc”，
“dok_ikona”：http://icons.iconarchive.com/icons/graphicloads/filetype/64/pdf-icon.png"
},
{
“帕瓦迪尼马斯”：“假装，雷卡拉维迈·比乌鲁伊”，
“antraste”：“Dėl išmokos”，
“tipas”：“高塔”，
“siunt gav数据”：“2015/08/25”，
“数据”：“2011/04/26”，
“dok_nr”：“G00-101”，
“dokumentai”：“dokumentas.pdf”，
“dok_ikona”：http://icons.iconarchive.com/icons/graphicloads/filetype/64/pdf-icon.png"
}
],
“栏目”：[
{
“className”：“详细信息控制”，
“数据”：空，
“defaultContent”：”
},
{“数据”：“pavadinimas”}，
{“数据”：“antraste”}，
{“数据”：“TIPA”}，
{“数据”：“siunt_gav_data”}，
{“数据”：“数据”}，
{“数据”：“dok_nr”}
],
“aoColumnDefs”：[
{'bSortable'：false，'aTargets'：[0,1,2,3]}
]
} );
//为打开和关闭详细信息添加事件侦听器
$（'#table tbody'）。在（'click'，'td.details control'，函数（）{
var tr=$（this.nexist（'tr'）；
var行=表.行（tr）；
if（row.child.isShown（））{
//此行已打开-关闭它
row.child.hide（）；
tr.removeClass（“显示”）；
}
否则{
//打开这一排
row.child（格式（row.data（））.show（）；
tr.addClass（“显示”）；
}
} );
} );
$（文档）.ready（函数（）{
$（“[rel='tooltip']”）。tooltip（）；
$（'.thumbnail'）。悬停(
函数（）{
$（this）.find（'.caption'）.slideDown（250）；//.fadeIn（250）
},
函数（）{
$（this）.find（'.caption'）.slideUp（250）；//.fadeOut（205）
}
); 
});

当您到达这一行代码时：

 $('.thumbnail').hover(

这张表还没有填好；因此，在处理加号的函数中，您必须再次添加代码，以在外部图像中产生悬停效果。

我改变了那部分：

$('.thumbnail').hover(
  function(){
    $(this).find('.caption').slideDown(250); //.fadeIn(250)
  },
  function(){
    $(this).find('.caption').slideUp(250); //.fadeOut(205)
  }
);

并使用：

$(document).on('mouseenter', '.thumbnail', function(){
  $(this).find('.caption').slideDown(250); //.fadeIn(250)
});
$(document).on('mouseleave', '.thumbnail', function(){
  $(this).find('.caption').slideUp(250); //.fadeOut(205)
});

---

使用

悬停

/

单击

等直接绑定功能将仅应用于加载的元素。但是，当您使用

on

方法（在过去

实时

）时，所有元素（事件中，尚未加载的元素将被绑定）

on

方法非常有用，尤其是当您使用通过AJAX加载的大量内容时

将此代码用于图像悬停：

    $("[rel='tooltip']").tooltip();    
 $(document).on("mouseenter", ".thumbnail", function() {
    $(this).find('.caption').slideDown(250); //.fadeIn(250)
});
 $(document).on("mouseleave", ".thumbnail", function() {
    $(this).find('.caption').slideUp(250); //.fadeOut(205)
});

---

小提琴

太棒了！Works pefectlyye这就是问题所在，但看不到解决方案。您必须在显示表中的图像后添加悬停效果（在“//打开此行”代码后加上righet）

    $("[rel='tooltip']").tooltip();    
 $(document).on("mouseenter", ".thumbnail", function() {
    $(this).find('.caption').slideDown(250); //.fadeIn(250)
});
 $(document).on("mouseleave", ".thumbnail", function() {
    $(this).find('.caption').slideUp(250); //.fadeOut(205)
});