爲滑塊上顯示的每個圖像創建一個id（基本jQuery滑塊）

-1

需要創建一個帶有每個圖像「標題」的動態標籤，但該標籤不在幻燈片中。我使用的插件：jQuery的基本滑塊的方式做，這將標籤：爲滑塊上顯示的每個圖像創建一個id（基本jQuery滑塊）

<p><script>document.getElementById("ID of the current image being displayed");</script></p>

感謝。

來源

2013-07-02 Maria

對不起，我可能失去了一些東西，但這個問題我也不清楚。你可以添加你寫的代碼，以便我們可以解決它嗎？ – JonRed

你好瑪麗亞我擔心你的問題需要更具體。你想實現什麼？你究竟在哪裏卡住？再加上一些更多的代碼會更加明顯。你知道你可以使用jQuery的建立選擇器嗎？ $（'＃youridhere'）或$（'。yourclasshere'）或$（'p'）等等。所以你不需要使用普通的javascript getElementById！ – cptnk

只有在圖像可見時纔會創建事件ID 謝謝。 – Maria

這應該符合您的要求。示範請參閱此Fiddle。

的JavaScript：

$(document).ready(function() { 

    function displayTitle() { 
     var imageTitle = $('img:visible').attr('title'); // get the title from the visible image 
     $('#title').html('Title: ' + imageTitle); 
    } 

    $('input:radio').bind('click', function() { 
     var selectedIndex = $(this).val(); 

     $('img').hide(); // hide all images 
     $('img').eq(selectedIndex).show(); // show image selected by radiobutton 

     displayTitle(); 
    }); 

    displayTitle(); 
});

HTML：

<div id="title"></div> 

<input type="radio" name="display-image" value="0">display image-1 
<input type="radio" name="display-image" value="1">display image-2 
<input type="radio" name="display-image" value="2">display image-3 

<br /> 

<img title="image-1" alt="image-1" /> 
<img title="image-2" alt="image-2" style="display:none" /> 
<img title="image-3" alt="image-3" style="display:none" />

來源

2013-07-02 20:54:43

爲滑塊上顯示的每個圖像創建一個id（基本jQuery滑塊）

回答

相關問題