尝试根据URL参数将jpg加载到页面上

问题描述

我有一个网站页面(Wiki页面),该页面根据打开页面时发送的URL参数重新使用。 URL参数用于过滤页面上各种文档库和自定义列表的内容

此外,我想添加将采用此URL参数的代码,并在自定义列表中查找项目以获取JPG图像并替换页面上当前的图像。 (或将其插入页面的左上方)。

关于如何实现此目标的任何想法?预先谢谢你。

解决方法

由于该站点现在通过将作业问题评为否定来惩罚学生/用户学习,因此,我将超越“专家”用户并发布该作业的答案。我花了很多时间,因为这不是我的专长。

我使用以下代码创建了脚本编辑器Web部件:

<script type="text/javascript" src="../SiteAssets/js-enterprise/DisplayVirtualPicture.CEWP.js"></script>
<script type="text/javascript">
        SP.SOD.executeFunc('sp.js','SP.ClientContext',LoadAll);
        function LoadAll()
        {getPicture();}
</script>
<img style="max-width:600px" title="undefined" src="https:xxxxxxx/SiteAssets/images/Blank.jpg">

脚本 DisplayVirtualPicture.CEWP.js 是:

var currentID = GetUrlKeyValue('Name');
//console.log(currentID);

function getPicture() {
    var mytable = "";
    var clientContext = new SP.ClientContext.get_current();
    var oList = clientContext.get_web().get_lists().getByTitle('VirtualPageLibrary');
    var camlQuery = new SP.CamlQuery();
    camlQuery.set_viewXml('<View><Query><Where><Eq><FieldRef Name=\'Title\'/><Value Type=\'Text\'>'+ currentID +'</Value></Eq></Where></Query></View>'); 

    var collListItem = oList.getItems(camlQuery);
    //clientContext.load(collListItem,'Include(VirtualPicture,Title,Id)');
    clientContext.load(collListItem);
    clientContext.executeQueryAsync(function () {
       var swListItms = collListItem.getEnumerator();
       while (swListItms.moveNext())
       {
           var swItm = swListItms.get_current();
           var mytable = swItm.get_item('VirtualPicture').get_url(); 
           //console.log("img="+mytable);
           $("img[title='undefined']").attr("src",mytable);
       }
       clientContext.executeQueryAsync(onQuerySucceededp,onQueryFailedp);
    },function (sender,args) 
    {
        console.log('Request failed. ' + args.get_message() +
            '\n' + args.get_stackTrace());
    });
}

function onQuerySucceededp(sender,args) {
    //console.log("success-1");
}
function onQueryFailedp(sender,args) {
    alert('Error: ' + args.get_message() + '\n' + args.get_stackTrace());
}

这可能不是实现此目的的最有效方法,但是如果没有与该站点上专家用户的合作,这是我能做到的最好的事情。