2
我有基於lightSlider的圖片庫,我試圖做到這一點,當我從下拉列表中選擇值時,圖庫將顯示與我的id相同的值(帶來焦點) :JQuery從基於選擇的下拉列表中的圖庫中選擇圖像
畫廊:
<ul id="image-gallery" class="gallery">
<li value="id1" data-thumb="images/72x72.jpg">
<img src="images/340x400.jpg" /> </li>
<li value="id2" data-thumb="images/72x72.jpg">
<img src="images/340x400.jpg" /> </li>
<li value="id3" data-thumb="images/72x72.jpg">
<img src="images/340x400.jpg" /> </li>
<li value="id4" data-thumb="images/72x72.jpg">
<img src="images/340x400.jpg" /> </li>
<li value="id5" data-thumb="images/72x72.jpg">
<img src="images/340x400.jpg" /> </li>
</ul>
和下拉:
<div class="styled-select">
<select class="show-labels">
<option id="id1" value="1"> 1</option>
<option id="id2" value="2"> 2</option>
<option id="id3" value="3"> 3</option>
<option id="id4" value="4"> 4</option>
<option id="id5" value="5"> 5</option>
</select>
我沒有想法如何做到這一點。我從選定的選項中選擇了id的值,但當我需要選擇(並帶來焦點)具有相同值的圖像時,不知道下一步該做什麼,並且在其他情況下,當點擊圖庫中的圖像時將下拉值更改爲所選項目值。
我嘗試:
$(function() {
$('.styled-select').on('change', function() {
var value = $('.show-labels').children(":selected").attr("id");
alert(value); /*just for check if it's working*/
});
});
我可能一直不清楚。我想在圖庫中顯示圖片(將其帶入焦點),當我選取與圖庫列表中值atrr相同值的下拉標識時 – dngy