jquery - 如果此属性值包含在引号中引号必须匹配错误

Question

我正在尝试设计带有缩略图的响应式图像 slider 。这是代码。

 <div class="cycle-slideshow"
     data-cycle-timeout=0
     data-cycle-pager="#pager2"
     data-cycle-pager-template="<span><img src={{firstChild.src}}/></span>"

>
    <span class="cycle-pager"></span>
    <span class="cycle-prev">&#9001;</span>
    <span class="cycle-next">&#9002;</span>
    <img src="Images/BackgroundAlternate.jpg" />
    <img src="Images/LogOut.jpg" />
    <img src="Images/BackgroundAlternate1.jpg" />
    <img src="Images/BackgroundAlternate2.jpg" />
    <img src="Images/BackgroundAlternate.jpg" />

</div>

在将该 span 标记添加到属性 data-cycle-pager-template 时，出现错误

if this attribute value is enclosed in quotation marks the quotation marks must match

这是为什么呢？提前致谢。

Answer 1

在属性 data-cycle-pager-template 中为 img src 添加单引号，并让 firstChild.src 的值绑定(bind)到一个没有任何引号的源:

<div class="cycle-slideshow"
     data-cycle-timeout=0
     data-cycle-pager="#pager2"
     data-cycle-pager-template="<span><img src='{{firstChild.src}}'/></span>">