slick.js中出现错误:“未捕获的TypeError:无法读取null的属性’add’”

我使用slick js作为图像的滑块视图

这是我的密码

<div class=“滑块\u包裹添加删除”>
<%=f、 字段|用于:图像不|图像|形式|%>
<%#=渲染“图像\u字段”,:f=>图像形式%>
<部门>
<%=image\u tag image\u form.object.picture.url,:class=>“下拉链接即使是img\u prev”%>
&lt/部门>
<div class=“image\u upload\u div”>
<div class=“图像上传”>
<标签>
<i class=“fa云上传”>
<%=image_form.file_字段:picture,:'data-role'=>“无”,:onchange=>“readURL(this);”,:accept=>'image/jpeg,image/png%>
&lt/i>
&lt/标签>
&lt/部门>
&lt/部门>
<%结束%>
<%=f、 链接到添加“添加图片”,:images,:id=>“添加图片”,类别=>“js添加幻灯片”,:style=>“显示:无;”%>
&lt/部门>
<脚本>
函数silder(){
slideIndex=0;
$('.add-remove').slick({
幻灯片放映:2,
幻灯片滚动:2
});
$('.js添加幻灯片')。在('click',function()上{
$('.add-remove').slick('slickAdd');
});
$('.js删除幻灯片')。在('click',function()上{
$('.add-remove').slick('slickRemove');
});
});
函数readURL(输入){
if(input.files&input.files[0]){
var reader=new FileReader();
reader.onload=函数(e){
$('.img_prev').last()
.attr('src',e.target.result)
};
reader.readAsDataURL(input.files[0]);
setTimeout(函数(){
$('add#pic')。触发器('click');
silder();
}, 100);
}
}
&lt/脚本>

现在有了这段代码,我就可以使用滑块了,但这并不正确,我遇到了一个错误:

未捕获的TypeError:无法读取null的属性“add”

这是因为调用init两次。这样做不会出错:

$(“.slider”).not(“.slick初始化”).slick()

而且,“silder”看起来像一个打字错误

依赖超时也容易出错。不幸的是,InternetExplorer使用不同的事件来告诉您何时加载了HTML元素和JS库。有许多库可以避免100行左右的跨浏览器代码,但流行的相对较小的jQuery解决了如下计时问题:

$(函数(){
//.ready()的处理程序调用。将滑动条等初始代码放在这里。
})

发表评论