0

以下はHtml構造です。クリックしたとき、またはJqueryを使用したときに、Div ID Inner_1_0、、、などを取得したいと思います。では、どのように取得する必要がありますか。Inner_1_1Inner_1_2Inner_1_3nextButtonprevButton

詳細については、デモリンクを提供しました。デモをご覧ください。

<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>

デモリンク。

4

5 に答える 5

1

現在選択されているアイテムを取得できる場合は、以下のコードで次と前のアイテムを取得できます

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

問題が発生した場合はお知らせください。

于 2013-03-05T07:03:37.293 に答える
1

after次のようなカルーセルの機能を使用できます。

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

更新されたフィドルのデモ

于 2013-03-05T07:11:54.870 に答える
1

これにはカルーセルコールバック関数(前/後)を使用する必要があるようです。

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

以下のjsfiddleを確認してください。

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

于 2013-03-05T07:14:03.453 に答える
0

よく使用できます

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 を運ぶ div です

于 2013-03-05T06:57:50.483 に答える
0

これはカウンターを設定し、ボタンが押されたときにスライドの ID を警告します。

var current_slide = 0;
$(".nextButton").click(function() {
    alert($(".slideItem")[current_slide].id;
    current_slide++;
}
于 2013-03-05T06:53:56.263 に答える