1

有没有人对我如何让jquery.qrcode使用简单的光滑滑块有任何意见？

我目前有一个滑块设置如下，以循环浏览另一个幻灯片中定义的提要中的项目数：

显示提要标题和摘要的主幻灯片我有一个 rel 属性，其中包含我要用于 QR 码的链接：

<!--Main Body-->
    <div class="sliderSidebar">
        <cfif isDefined("variables.feedData.maxItems") and variables.feedData.maxItems>
        <cfif variables.feedData.type neq "atom">
            <cfloop from="1" to="#variables.feedData.maxItems#" index="i">
                <div class="slide" rel="#variables.feedData.itemArray[i].link.xmlText#">
                    <cfset QR = "rel">  
                    <h3>#variables.feedData.itemArray[i].title.xmlText#</h3>
                    <p>#variables.feedData.itemArray[i].description.xmlText#</p>
                </div>
            </cfloop>
        <cfelse>
            <cfloop from="1" to="#variables.feedData.maxItems#" index="i">
                <div class="slide" rel="#variables.feedData.itemArray[i].link.xmlText#">
                    <cfset QR = "rel">  
                    <h3>#variables.feedData.itemArray[i].title.xmlText#</h3>
                    <p>#variables.feedData.itemArray[i].summary.xmlText#</p>
                </div>
            </cfloop>
        </cfif>
        </cfif>

将与主滑块一起循环的 QR 码滑块

        <div class="qrSlider">      
        <cfif isDefined("variables.feedData.maxItems") and variables.feedData.maxItems>
            <cfif variables.feedData.type neq "atom">
                <cfloop from="1" to="#variables.feedData.maxItems#" index="i">
                    <div id="qrBox" class="qrCode"></div>
                </cfloop>
            <cfelse>
                <cfloop from="1" to="#variables.feedData.maxItems#" index="i">
                    <div id="qrBox" class="qrCode"></div>
                </cfloop>
            </cfif>
        </cfif>
    </div>

我的javascript被设置为：

        <cfif isDefined("variables.feedData.maxItems") and variables.feedData.maxItems>
        <cfif variables.feedData.type neq "atom">
            <cfloop from="1" to="#variables.feedData.maxItems#" index="i">
                <script>
                    $(document).ready(function(){
                                jQuery('.qrCode').qrcode({
                                text    : "#variables.feedData.itemArray[i].link.xmlText#",
                                width   : "115",
                                height  : "110"
                            }); 
                    });
                </script>
            </cfloop>
        <cfelse>
            <cfloop from="1" to="#variables.feedData.maxItems#" index="i">
                <script>
                    $(document).ready(function(){
                        jQuery('.qrCode').qrcode({
                                text    : "#variables.feedData.itemArray[i].link.xmlText#",
                                width   : "115",
                                height  : "110"
                            }); 
                    });
                </script>
            </cfloop>
        </cfif>
    </cfif>

我遇到的问题是每个 RSS 提要条目中的所有二维码都被放置在一张幻灯片中并循环到下一张幻灯片。到达下一张幻灯片时，显示的二维码始终是第一个代码。有人对如何将一个二维码成功放入每张幻灯片有任何想法吗？

4

1 回答 1

1

首先，你的每一个 QR<div>都有相同的id.

其次，您的主要问题（实际上与第一个问题有关）是这一行： jQuery('.qrCode').qrcode({...})

您正在做的是为所有QR创建相同的 QRCode <div>！在您的循环中，您应该id改为指定唯一容器。例如，假设您将索引号附加到每个容器的id属性，您可以按如下方式引用每个容器：

<cfoutput>
<cfloop from="1" to="#variables.feedDAta.maxItems#" index="i">
   $('##qrBox#i#).qrcode({...});
</cfloop>
</cfoutput>

最后，您的 jQuery 代码没有被有效地输出。例如，您不需要$(document).ready()为每个脚本调用......我将它们包装在一个调用中，并<cfloop>在那里执行 my 's。

希望这是有道理的。

于 2015-08-12T15:22:58.547 回答