JavaScript畫廊到SPservices

Question

我發現不錯的JavaScript圖庫here。我試圖使用SPServices從Sharepoint庫中獲取數據。但沒有工作。我的代碼有問題嗎？

<script type="text/javascript" src="/Jscript/Jquery/jquery-1.12.3.min.js"></script> 
 
<script type="text/javascript" src="/Jscript/SPServices/jquery.SPServices-2014.02.min.js"></script> 
 
<script type="text/javascript" src="/Script/js/fotorama.js"></script> 
 
<link rel="stylesheet" href="/Script/js/fotorama.css" /> 
 

 

 
<script language="javascript" type="text/javascript"> 
 

 
$(document).ready(function() { 
 
    $().SPServices({ 
 
    operation: "GetListItems", 
 
    async: false, 
 
    listName: "2007PhotoAlbum", 
 
    CAMLViewFields: "<ViewFields></ViewFields>", 
 
    completefunc: function (xData, Status) { 
 
     $(xData.responseXML).SPFilterNode("z:row").each(function() { 
 
\t 
 
\t \t 
 
     var liHtml = "<div class='fotorama'><img src='" + "/photos/2007PhotoAlbum/" + $(this).attr("ows_PicFilename") +"'" + "></div>"; 
 
     $("#fotorama").append(liHtml); 
 
     }); 
 
    } 
 
    }); 
 
}); 
 

 

 
</script> 
 
<div id="fotorama" data-width="700" data-ratio="700/467" data-max-width="100%"></div> 
 
<script> 
 
$('.fotorama').fotorama({ 
 
    width: 700, 
 
    maxwidth: '100%', 
 
    ratio: 16/9, 
 
    allowfullscreen: true, 
 
    nav: 'thumbs' 
 
}); 
 
</script>

Answer 1

的SPServices調用運行庫代碼之前可能無法完成。這使得它看起來像SPServices沒有返回任何數據。您可以先檢查SPServices是否正在返回數據。該代碼將輸出寫入頁面。

$().SPServices({ 
    operation: "GetListItems", 
    async: false, 
    listName: "2007PhotoAlbum", 
    CAMLViewFields: "<ViewFields></ViewFields>", 
    completefunc: function(xData, Status) { 
     /***********************************Debugging*******************************/ 
      var out = $().SPServices.SPDebugXMLHttpResult({ 
      node: xData.responseXML 
      }); 
      $("#debug").html("").append("<b>This is the output from the GetList operation:</b>" + out); 
     /***************************************************************************/ 

     $(xData.responseXML).SPFilterNode("z:row").each(function() { 


     var liHtml = "<div class='fotorama'><img src='" + "/photos/2007PhotoAlbum/" + $(this).attr("ows_PicFilename") +"'" + "></div>"; 
     $("#fotorama").append(liHtml); 
     }); 
    } 
    }); 

只要這返回數據，我建議使用承諾重寫您的SPServices調用。然後在返回承諾後運行.fotorama。馬克比較有和沒有承諾here。