1

我正在通过 for 循环将图像插入要显示在滑块上的 html 部分。我试图让它显示在我的浏览器上，但我的开发人员工具不断向我抛出一个奇怪的错误。我想我在某处插入了一个字符，而 jquery 库不喜欢它。

未捕获的错误：语法错误，无法识别的表达式：[object Object]:eq(0)

这是我的代码。

var theImgHTML = "<div class='slides_container portfolio-img'>";

for (i = 0; i < imgList.length; i++) {
    theImgHTML += "<img src='images/portfolio/" + imgList[i] + "' alt='Slide " + (i + 1) + "' />";
}

theImgHTML += "</div>";

$("#slides").html(theImgHTML);

$("#slides").slides({
    preload: true,
    preloadImage: 'img/loading.gif',
    play: 5000,
    pause: 2500,
    hoverPause: true
});​

这是 html 中的结果。

<div class="slides_container portfolio-img" style="overflow: hidden; position: relative; display: block; background-image: url(loading.gif); background-position: 50% 50%; background-repeat: no-repeat no-repeat;">
    <div class="slides_control" style="position: relative; width: 0px; height: 0px; left: 0px;">
        <img src="images/portfolio/one.jpg?1354641162837" alt="Slide 1" style="position: absolute; top: 0px; left: 0px; z-index: 0; display: none;">
        <img src="images/portfolio/two.jpg" alt="Slide 2" style="position: absolute; top: 0px; left: 0px; z-index: 0; display: none;">
        <img src="images/portfolio/three.jpg" alt="Slide 3" style="position: absolute; top: 0px; left: 0px; z-index: 0; display: none;">
    </div>
</div>

想法？

4

1 回答 1

0

最终的问题是，当将变量“theImgHTML”（包含我的图像的标记）添加到幻灯片中时，我需要用 div 包含每个图像。我没有那样做。根据幻灯片插件，当要显示图像时..每个 div 都需要有一个包含 div 围绕每个图像。

我在没有 div 的情况下尝试了它，只是自己拥有图像，插件不接受它（因此出现上述错误）。希望这可以帮助将来的人。

这是一个可行的示例。

<div id="slides">
     <div class="slides_container">
          <div>
             <img src="http://placehold.it/570x270">
          </div>
          <div>
             <img src="http://placehold.it/570x270">
          </div>
      </div>
</div>

有关更多信息，请转到下面的链接并转到基本标记。

http://www.slidesjs.com/

于 2012-12-05T17:17:12.130 回答