2013-07-15 54 views
0

嗨我想添加圖像到一個按鈕的內容流。當你點擊按鈕時,函數將被調用並且所有的圖像都會被加載。 這是我的代碼。contentflow通過函數添加項目

<link rel='stylesheet' title='Standard' href='contentflow/cfstyles.css' type='text/css' media='screen' /> 
<script language='JavaScript' type='text/javascript' src='contentflow/contentflow.js'></script> 
<script type='text/javascript' src='contentflow/jquery.min.js'></script>` <div style='width:400px;height:200px;' class='maincontent'> 


<div id='contentFlow' class='ContentFlow'>  
    <div class='loadIndicator'><div class='indicator'></div></div> 
    <div id='adddiv' class='flow'> 
//images should come to here  
    </div> 
    <div class='globalCaption'></div> 
    <div class='scrollbar'> 
     <div class='slider'><div class='position'></div></div> 
    </div> 

</div> 

<input type="button" value="Click me!" onclick="start();" />` 

<script tyle='text/javascript'> 

function start(){ 
var cf = new ContentFlow('contentFlow', {reflectionColor: '#000000'}); 
$(document).ready(function() { 
for (var i=0; i<15; i++){ 
$("#adddiv").prepend(" <div class='item'><img onclick='start(" + i + ");' class='content' src='contentflow/pics/pic"+i+".png'/><div class='caption'>" + i + "</div></div>"); 

} 
}); 

}

如果我不使用按鈕和功能是直接寫給加載所有的圖像,但如果我想加載與功能圖像這是行不通的。 這裏有什麼問題?

+0

其執行'$(文件)。就緒()'的事件,已經被解僱了很長時間的執行進入之前,你'開始()'... – Teemu

+0

我刪除它,但沒有區別。 – user1874941

+0

你需要將它移動到start()之上而不是刪除。 – Teemu

回答

2

最後我使用下面的代碼工作。

<div id='ajax_cf' class='ContentFlow'> 
<div class='flow'> </div> 
<div class='scrollbar'><div class='slider'><div class='position'></div></div></div> 

<input type="button" value="get images!" onclick="getPictures();" /> 

var ajax_cf = new ContentFlow('ajax_cf'); 

function addPictures(){ 
    var ic = document.getElementById('itemcontainer'); 
    var is = ic.getElementsByTagName('img'); 
    for (var i=0; i< is.length; i++) { 
     ajax_cf.addItem(is[i], 'last'); 
    } 
    } 
function getPictures() { 
for (var i=0; i<15; i++){ 
$("#itemcontainer").prepend("<img onclick='' class='content' src='contentflow/pics/pic0.png'/>");` 
    } 
addPictures(); 
} 
相關問題