多个值文件上传器实例答案

【问题标题】：multiple instances of valums file uploader多个值文件上传器实例
【发布时间】：2013-10-06 21:49:25
【问题描述】：

我正在尝试让多个值文件上传器实例在我的网站上运行。它适用于一个实例，但无论何时我循环初始化代码，想要多个按钮，我都看不到任何按钮。代码如下：

<cfoutput query="getTopics">

<script>        
    function createUploader(){            
        var uploader = new qq.FileUploader({
            element: document.getElementById('file-uploader#refTopicID#'),
            action: 'components/ProjectBean.cfc',
            params: {method: 'Upload',
                    topicID: #refTopicID#,
                    count: #Evaluate("session.#refTopicAbv#Count")#,
                    topicName: '#refTopicAbv#'
                    },
            encoding: 'multipart'
        });           
    }

    // in your app create uploader as soon as the DOM is ready
    // don't wait for the window to load  
    window.onload = createUploader;     
</script>

<div class="row" id="file-uploader#refTopicID#">        
</div>

知道如何获取多个实例吗？提前致谢！

【问题讨论】：

请不要使用 Evaluate()！您应该能够像这样引用您的变量：count: #session[refTopicAbv & "Count"]#,

标签： javascript coldfusion coldfusion-10 valums-file-uploader

【解决方案1】：

您正在循环内创建一个 javascript 函数。换句话说，您要多次定义它。

相反，您应该将 createUploader 函数移到循环之外。在循环中，只需为每个主题多次调用它即可。

类似这样的：

<script>        
    function createUploader(elementID, topicID, topicCount, topicName){            
        var uploader = new qq.FileUploader({
            element: document.getElementById(elementID),
            action: 'components/ProjectBean.cfc',
            params: {method: 'Upload',
                    topicID: topicID,
                    count: topicCount,
                    topicName: topicName
                    },
            encoding: 'multipart'
        });           
    }   
</script>

<cfoutput query="getTopics">
<script>        
    createUploader('file-uploader#getTopics.refTopicID#', #getTopics.refTopicID#, #session[getTopics.refTopicAbv & "Count"]#, '#getTopics.refTopicAbv#');   
</script>

<div class="row" id="file-uploader#getTopics.refTopicID#"> </div>
</cfoutput>

注意：我假设这些值都来自您的查询getTopics，所以我在它们前面加上了查询名称以正确确定它们的范围。这通常不是必需的，但出于性能原因（除其他外），这是一种很好的做法。

【讨论】：