首页 > 解决方案 > 如何使用 EncodedAbsUrl 从列表中将图像附加到 DOM 中

问题描述

我有 2 个包含 5 列的列表;一个有标题、问题、律师、ID 和律师图片。最后一个正在查看图像列表。我为此创建了一个 webpart,因此实际的 webpart 看起来像这样。

<script type="text/javascript">

 apiUrl = "/Legal/Attorneys/_api/web/lists/GetByTitle('attorneysBio')/items$select=*,EncodedAbsUrl,attorneysPic/Title&$expand=attorneysPic/Id";
    topicsTitle = '';
    title = 'TITLE HERE';

</script>

javascript代码看起来像这样

var buildCards = function () {
                    if (filterTopic.length !== 0) {
                        for (i = 0; i < filterTopic.length; i++) {
                            var accID2 = accID.replace(/\s/g, '');
                            var faqItems = filterTopic[i]
                            var headerID = "heading" + faqItems.ID
                            var cardBodyID = "collapse" + faqItems.ID
                            var cardTitle = faqItems.Title
                            var cardBody = faqItems.Question
                            var attorneyPics = faqItems.attorneysPic.EncodedAbsUrl
                            console.log(attorneyPics)

                            var cardBuild = '<div class="card">' +
                                '<div class="card-header pb-1 pl-0" role="tab" id="' + headerID + '">' +
                                '<a class="collapsed" data-toggle="collapse" data-parent="#' + accID2 + '" href="#' + cardBodyID + '" aria-expanded="false" aria-controls="' + cardBodyID + '">' +
                                '<h5 class="mb-0 font-thin">' + cardTitle + '<span class="rotate"></span></h5>' +
                                '</a>' +
                                '</div>' +
                                '<div id="' + cardBodyID + '" class="collapse" role="tabpanel" aria-labelledby="' + headerID + '" data-parent="#' + accID + '">' +
                                '<div class="row"><div class="col-md-3"><img src="'+attorneyPics+'" class="img-responsive"></div>' +
                                '<div class="col-md-9"><div class="card-body py-1 pl-0"><p>' + cardBody + '</p></div></div></div>' +
                                '</div>' +
                                '</div>'
                            $(".accordion").append(cardBuild);
                        };
                    } else {
                        var cardBuild = '<h4>There are no results matching your search.</div>'
                        $(".accordion").append(cardBuild);
                    }

发生的事情是,给出的 url 来自实际列表,而不是来自列表项“ https://browardauthor/Legal/Attorneys/Lists/attorneysBio/1_.000

标签: javascriptsharepoint

解决方案


推荐阅读