如何使用jquery獲取ID？

以下是Html結構。現在我想要使用Jquery獲得Div ID Inner_1_0,Inner_1_1,Inner_1_2,Inner_1_3等點擊nextButton或prevButton。所以我應該如何檢索。如何使用jquery獲取ID？

更多，我給演示鏈接。請參閱演示

<div id="Inner_1_0" class="slideItem" style="width: 600px; height: 440px; top: 0px; right: 165px; opacity: 1; z-index: 17; display: block;"> 
    <a href="#" onclick="loadVideo(&quot;x_elT6zkqN0&quot;);" title="" oh="" jane="" jaana"="" salman="" khan="" full="" song="" |="" pyaar="" kiya="" toh="" darna="" kya"=""><img src="http://img.youtube.com/vi/x_elT6zkqN0/hqdefault.jpg" width="213px" height="141px" style="width: 600px; height: 400px;"></a> 
    <div class="shadow" style="width: 600px; z-index: -1; position: absolute; margin: 0px; padding: 0px; border: none; overflow: hidden; left: 0px; bottom: 0px;"> 
     <div class="shadowLeft" style="position: relative; float: left;"></div> 
     <div class="shadowMiddle" style="position: relative; float: left; width: 400px;"></div> 
     <div class="shadowRight" style="position: relative; float: left;"></div> 
    </div> 
</div> 
<div id="Inner_1_1" class="slideItem" style="width: 600px; height: 440px; top: 0px; right: 165px; opacity: 1; z-index: 17; display: block;"> 
    <a href="#" onclick="loadVideo(&quot;x_elT6zkqN0&quot;);" title="" oh="" jane="" jaana"="" salman="" khan="" full="" song="" |="" pyaar="" kiya="" toh="" darna="" kya"=""><img src="http://img.youtube.com/vi/x_elT6zkqN0/hqdefault.jpg" width="213px" height="141px" style="width: 600px; height: 400px;"></a> 
    <div class="shadow" style="width: 600px; z-index: -1; position: absolute; margin: 0px; padding: 0px; border: none; overflow: hidden; left: 0px; bottom: 0px;"> 
     <div class="shadowLeft" style="position: relative; float: left;"></div> 
     <div class="shadowMiddle" style="position: relative; float: left; width: 400px;"></div> 
     <div class="shadowRight" style="position: relative; float: left;"></div> 
    </div> 
</div> 
<div id="Inner_1_2" class="slideItem" style="width: 600px; height: 440px; top: 0px; right: 165px; opacity: 1; z-index: 17; display: block;"> 
    <a href="#" onclick="loadVideo(&quot;x_elT6zkqN0&quot;);" title="" oh="" jane="" jaana"="" salman="" khan="" full="" song="" |="" pyaar="" kiya="" toh="" darna="" kya"=""><img src="http://img.youtube.com/vi/x_elT6zkqN0/hqdefault.jpg" width="213px" height="141px" style="width: 600px; height: 400px;"></a> 
    <div class="shadow" style="width: 600px; z-index: -1; position: absolute; margin: 0px; padding: 0px; border: none; overflow: hidden; left: 0px; bottom: 0px;"> 
     <div class="shadowLeft" style="position: relative; float: left;"></div> 
     <div class="shadowMiddle" style="position: relative; float: left; width: 400px;"></div> 
     <div class="shadowRight" style="position: relative; float: left;"></div> 
    </div> 
</div> 
<div id="Inner_1_3" class="slideItem" style="width: 600px; height: 440px; top: 0px; right: 165px; opacity: 1; z-index: 17; display: block;"> 
    <a href="#" onclick="loadVideo(&quot;x_elT6zkqN0&quot;);" title="" oh="" jane="" jaana"="" salman="" khan="" full="" song="" |="" pyaar="" kiya="" toh="" darna="" kya"=""><img src="http://img.youtube.com/vi/x_elT6zkqN0/hqdefault.jpg" width="213px" height="141px" style="width: 600px; height: 400px;"></a> 
    <div class="shadow" style="width: 600px; z-index: -1; position: absolute; margin: 0px; padding: 0px; border: none; overflow: hidden; left: 0px; bottom: 0px;"> 
     <div class="shadowLeft" style="position: relative; float: left;"></div> 
     <div class="shadowMiddle" style="position: relative; float: left; width: 400px;"></div> 
     <div class="shadowRight" style="position: relative; float: left;"></div> 
    </div> 
</div> 

<div class="nextButton"></div> 
<div class="prevButton"></div>

Demo link.

來源

2013-03-05 Rushikesh jogle

你想在一行中用逗號分隔嗎？ – Silagy 2013-03-05 06:48:28

不，當我點擊第一次「nextButton」時，我會得到「Inner_1_1」，當我點擊第二次，然後我會得到「Inner_1_2」。 – 2013-03-05 06:53:26

你想要做什麼？你想做一個滑塊嗎？或嚮導？ – IamStalker 2013-03-05 06:56:24

的樣子，你應該使用轉盤的回調函數（/前後）這一點。

before: function (carousel) { alert(carousel.current)},

檢查下面的jsfiddle。

http://jsfiddle.net/4HSpH/10/

來源

2013-03-05 07:14:03 user991554

這正是我想要的...謝謝:) – 2013-03-05 08:11:40

這將設置一個計數器和警報時，按下按鈕，滑塊的ID：

var current_slide = 0; 
$(".nextButton").click(function() { 
    alert($(".slideItem")[current_slide].id; 
    current_slide++; 
}

來源

2013-03-05 06:53:56

以及你可以使用

var ids = $("#container").children().map(function(n, i) { 
    return n.id; 
});

或每（）：

var ids = $("#container").children().each(function(n, i) { 
    var id = this.id; 
    //your code 
});

這裏的容器是承載所有這些div

來源

2013-03-05 06:57:50

如果你能得到當前選擇的項目，然後我們可以通過下面的代碼

獲得next和prev項目DIV

//For Next 
      var nextdivId = $(selectedItem).next().attr("id"); 
//For Prev 
      var prevdivId = $(selectedItem).prev().attr("id");

讓我知道你是否有任何問題。

來源

2013-03-05 07:03:37

你可以使用你的轉盤after功能，如：

$('.carousel').carousel({ 
    carouselWidth: 930, 
    carouselHeight: 330, 
    directionNav: true, 
    shadow: true, 
    buttonNav: 'bullets', 
    after: function(obj) { 
     alert($("div.slideItem").eq(obj.current).attr("id")); 
    } 
});

更新小提琴demo

來源

2013-03-05 07:11:54

我的問題已解決:) – 2013-03-05 08:25:55

很高興它爲你工作... :) – 2013-03-05 08:47:08

如何使用jquery獲取ID？

回答

相關問題