Jssor导致JavaScript错误。 IE 8和IE 11也是同样的问题。
我尝试了什么：
选中https://stackoverflow.com/questions/26465515/script5007-error-in-jssor-slider-in-ie8
选中https://stackoverflow.com/questions/26632335/jssor-slider-js-error-on-testing-server
选中JSSOR - Cannot read type property 'currentStyle' of undefined
在github上更新到最新版本的jssor。
检查代码中的错误代码。
在其他浏览器上查看，效果很好。
结果
无法获得任何有效的解决方案。
错误消息
Error line `var jssor_slider1 = new $JssorSlider$("slider1_containerc", options);`
Uncaught TypeError: Cannot read property 'currentStyle' of undefined jssor.slider.min.js:2
E jssor.slider.min.js:2
V jssor.slider.min.js:2(anonymous function) jssor.slider.min.js:2
f.$JssorSlider$ jssor.slider.min.js:2
$.ajax.success map.js:584
j jquery-2.1.1.min.js:2
k.fireWith jquery-2.1.1.min.js:2
x jquery-2.1.1.min.js:4(anonymous function)
代码;
HTML
<div class="sideshowcontc"><div class="slideshowc" id="slidemapc"><img class="slidelegendc" src="images/chlor_a-legend.png"><div id="slider1_containerc" style="position: relative; top: 0px; left: 0px; width: 640px; height: 612px; display: inline-block;">
<!-- Slides Container -->
<div u="slides" style="cursor: move; position: absolute; overflow: hidden; left: 0px; top: 0px; width: 640px; height: 612px;"> <div><img u="CHLOR_A-2003-APR-MAY-JUN" src="data/chlor_a/seasonal/chlor_a-2003-Apr-May-Jun.png">
<div style="position: absolute; bottom: 0px; left: 0px; width: 640px; height: 50px;
background-color: #4f91da; opacity: 0.9; filter: alpha(opacity=90);">
</div>
<div style="position: absolute; bottom: 0px; left: 0px; width: 640px; height: 50px;
color: White; font-size: 16px; font-weight: bold; line-height: 50px; text-align: center;">CHLOR_A-2003-APR-MAY-JUN</div></div>
<div><img u="CHLOR_A-2004-APR-MAY-JUN" src="data/chlor_a/seasonal/chlor_a-2004-Apr-May-Jun.png">
<div style="position: absolute; bottom: 0px; left: 0px; width: 640px; height: 50px;
background-color: #4f91da; opacity: 0.9; filter: alpha(opacity=90);">
</div>
<div style="position: absolute; bottom: 0px; left: 0px; width: 640px; height: 50px;
color: White; font-size: 16px; font-weight: bold; line-height: 50px; text-align: center;">CHLOR_A-2004-APR-MAY-JUN</div></div>
<div><img u="CHLOR_A-2005-APR-MAY-JUN" src="data/chlor_a/seasonal/chlor_a-2005-Apr-May-Jun.png">
<div style="position: absolute; bottom: 0px; left: 0px; width: 640px; height: 50px;
background-color: #4f91da; opacity: 0.9; filter: alpha(opacity=90);">
</div>
<div style="position: absolute; bottom: 0px; left: 0px; width: 640px; height: 50px;
color: White; font-size: 16px; font-weight: bold; line-height: 50px; text-align: center;">CHLOR_A-2013-APR-MAY-JUN</div></div>
</div>
<span u="arrowleft" class="jssora03l" style="width: 55px; height: 55px; top: 200px; left: 8px;">
</span>
<span u="arrowright" class="jssora03r" style="width: 55px; height: 55px; top: 200px; right: 8px">
</span>
</div></div></div>
jssor js in jquery ajax function：
var _CaptionTransitions = [];
var _SlideshowTransitions = [
//{$Duration:1200,x:0.3,$SlideOut:true,$Easing
{$Left:$JssorEasing$.$EaseInCubic,$Opacity:$JssorEasing$.$EaseLinear},$Opacity:2}
{$Duration:3000,$Opacity:4,$Brother:{$Duration:3000,$Opacity:1}}//Fade
];
var options = {
$AutoPlay: true, //[Optional] Whether to auto play, to enable slideshow, this option must be set to true, default value is false
$DragOrientation: 1, //[Optional] Orientation to drag slide, 0 no drag, 1 horizental, 2 vertical, 3 either, default value is 1 (Note that the $DragOrientation should be the same as $PlayOrientation when $DisplayPieces is greater than 1, or parking position is not 0)
$CaptionSliderOptions: { //[Optional] Options which specifies how to animate caption
$PlayInMode: 1, //[Optional] 0 None (no play), 1 Chain (goes after main slide), 3 Chain Flatten (goes after main slide and flatten all caption animations), default value is 1
$PlayOutMode: 3 //[Optional] 0 None (no play), 1 Chain (goes before main slide), 3 Chain Flatten (goes before main slide and flatten all caption animations), default value is 1
},
$AutoPlayInterval: 1500, //[Optional] Interval (in milliseconds) to go for next slide since the previous stopped if the slider is auto playing, default value is 3000
$SlideshowOptions: { //[Optional] Options to specify and enable slideshow or not
$Class: $JssorSlideshowRunner$, //[Required] Class to create instance of slideshow
$Transitions: _SlideshowTransitions, //[Required] An array of slideshow transitions to play slideshow
$TransitionsOrder: 1, //[Optional] The way to choose transition to play slide, 1 Sequence, 0 Random
$ShowLink: true
},
$HWA:false,
$ArrowNavigatorOptions: { //[Optional] Options to specify and enable arrow navigator or not
$Class: $JssorArrowNavigator$, //[Requried] Class to create arrow navigator instance
$ChanceToShow: 2, //[Required] 0 Never, 1 Mouse Over, 2 Always
$AutoCenter: 0, //[Optional] Auto center arrows in parent container, 0 No, 1 Horizontal, 2 Vertical, 3 Both, default value is 0
$Steps: 1 //[Optional] Steps to go for each navigation request, default value is 1
}
};
var jssor_slider1 = new $JssorSlider$("slider1_containerc", options); // The error line is here.
function ScaleSlider() {
var parentWidth = $(".resulttab2").width() - 90;
if (parentWidth) {
jssor_slider1.$ScaleWidth(Math.min(parentWidth, 640));
}
}
ScaleSlider();
答案 0 :(得分：2)
以下几行无需删除。
var _CaptionTransitions = [];
$CaptionSliderOptions: { //[Optional] Options which specifies how to animate caption
$PlayInMode: 1, //[Optional] 0 None (no play), 1 Chain (goes after main slide), 3 Chain Flatten (goes after main slide and flatten all caption animations), default value is 1
$PlayOutMode: 3 //[Optional] 0 None (no play), 1 Chain (goes before main slide), 3 Chain Flatten (goes before main slide and flatten all caption animations), default value is 1
},
答案 1 :(得分：0)
This Worked for me. Flicker in the chart was issue.
function fixFlicker（docid，tname）{
var eDoc = document.getElementById(docid);
var cNode = eDoc.getElementsByTagName(tname);
//Copy All the Tag Name
var arr = [];
for (var i = 0; i < cNode.length; i++) {
arr.push(cNode[i].id);
} //End for loop
//Delete the Container Elements
eDoc.innerHTML = "";
//Add back each element
for (var j = 0; j < arr.length; j++) {
var newElement = {};
var newElement = document.createElement(tname);
newElement.setAttribute("id", arr[j]);
eDoc.appendChild(newElement)
console.log(newElement);
}
}//End of Flicker Clean Up
fixFlicker("div", "canvas");