已解決430363個問題，去搜搜看，總會有你想問的

GliderJS 如何在輪播中的特定索引處添加項目？

首頁猿問 GliderJS...

GliderJS 如何在輪播中的特定索引處添加項目？

JavaScript

慕桂英3389331 2023-11-02 17:03:28

我正在使用 gliderJS 創建一個輪播，我需要動態地向其添加和刪除項目。我設法讓它與.addItem和.removeItem()方法一起工作，雖然removeItem支持從特定索引中刪除，但我在文檔中沒有看到任何在特定索引處添加Item的方法，有人知道這是否可能嗎？這是到目前為止添加的代碼：const elementHTML = "somehtml";const element = document.createElement("div");element.innerHTML = elementHTML;glider.addItem(element);這將其添加到輪播的末尾，我想將其添加到特定索引處。

查看完整描述

1 回答

牛魔王的故事

TA貢獻1830條經驗獲得超3個贊

沒有公開的 api 專門執行此操作。但是，您可以更改滑翔機的內容并調用refresh，這確實正是該addItem方法的作用：

? gliderPrototype.addItem = function (ele) {

? ? var _ = this

? ? _.track.appendChild(ele)

? ? _.refresh(true)

? ? _.emit('add')

? }

因此理論上，您應該能夠將子項添加到軌道中的特定索引并調用刷新，如下所示：

const glider = new Glider(document.querySelector('.glider'), {

? slidesToShow: 5,

? slidesToScroll: 5,

? draggable: true

})

function insertBeforeIndex (element, index) {

? glider.track.insertBefore(element, glider.track.children[index])

? glider.refresh()

}

const newElement = document.createElement("div")

newElement.innerHTML = "<em>new item</em>"

insertBeforeIndex(newElement, 2) // inserts it in 3rd place

.box {

? border: 2px solid lightblue;

}

? <div class="glider">

? ? <div class="box"> 1 </div>

? ? <div class="box"> 2 </div>

? ? <div class="box"> 3 </div>

? ? <div class="box"> 4 </div>

? </div>

</div>

反對回復 2023-11-02

1 回答
0 關注
136 瀏覽

關注

添加回答

舉報

0/150

提交

取消

亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

熱搜

最近搜索清空

GliderJS 如何在輪播中的特定索引處添加項目？

GliderJS 如何在輪播中的特定索引處添加項目？

1 回答

添加回答

GliderJS 如何在輪播中的特定索引處添加項目？

GliderJS 如何在輪播中的特定索引處添加項目？