0

これで、画像を表示する html ページができました。div には 1 つの画像ファイルしか含まれていないことに注意してください。

<div="div_1"><img id = "img_1" src = '....' /></div>

私が実装したいのは、ユーザーが div をダブルクリックし、jquery/js を介して "div_1" または "img_1" を取得することです。より良い方法では、 "1" を取得します。実装することは可能ですか / それを達成するのに役立つ機能はありますか?

ありがとう

更新しました：

現在のHtmlコードはそのようなものです

<div class="turn-page-wrapper" page="2" style="position: absolute; overflow: hidden; width: 28.5px; height: 37px; top: 0px; left: 0px; right: auto; bottom: auto; z-index: 6;">
<div style="position: absolute; top: 0px; left: 0px; overflow: hidden; z-index: auto; width: 47px; height: 47px;">
<div id="div_2" class="turn-page p2" style="width: 28.5px; height: 37px; -webkit-transform-origin: 0% 0%; position: absolute; top: 0px; left: 0px; bottom: auto; right: auto;">
<img id="img_2" src="demo/medium/Web081112_P002_medium.jpg" alt="flip book">
</div>
</div>
</div>

var id = $(this).attr("id");結果としてページを返すと、私の場合はそれほど単純ではないようです。私の場合、ページの属性、画像のIDを取得できない場合、個々の画像の実際のIDを取得できないことを意味しますか? ありがとう

最も更新された (残り 1 つの欠陥のみ!)

$("div.turn-page").dblclick(function() {
var id = this.id;
num = id.split("_")[1];
alert (num);
});

現在、これを使用して id を取得していますが、最後の結果 (ターン可能ではない) については、ダブルクリックしても応答しないか、何もしません。しかし、クラスにはページめくりp7があるので、それはうまくいくはずです?

   <div class="turn-page-wrapper" page="7" style="position: absolute; overflow: hidden; width: 609.5922459893047px; height: 793px; top: 0px; right: 0px; left: auto; bottom: auto; z-index: 6;">
    <div style="position: absolute; top: 0px; left: 0px; overflow: hidden; z-index: auto; width: 1000px; height: 1000px;">
    <div id="div_7" class="turn-page p7" style="width: 609.5922459893047px; height: 793px; position: absolute; top: 0px; left: 0px; bottom: auto; right: auto;">
    <img id="img_7" src="demo/medium/Web081112_P007_medium.jpg" alt="flip book">
    </div>
    </div>
    <div style="top: 0px; left: 0px; overflow: hidden; z-index: 1; width: 610px; height: 793px;">
    </div>
    </div>
4

3 に答える 3

2

これは JavaScript で行うことができます。

document.getElementById("div_1").children[0].id

これは、「div_1」div の最初の子の ID を返します

于 2012-12-08T03:46:45.250 に答える
1

このような：

$("div").dblclick(function() {
    var id = this.id,
        num = id.split("_")[1],
        imgSrc = $(this).find("img").attr("src");

    // do something with the id, the number, or the image src
});

デモ: http://jsfiddle.net/LGwK7/

これにより、ダブルクリック ハンドラーがすべてのdiv 要素にバインドされるため、関心のある要素だけに共通のクラスを追加して、それらにバインドすることができます。（クリックされたもののIDを取得する方法を尋ねたので、IDでバインドするのは意味がないと思います。）

HTML にエラーがあることに注意してください<div="div_1"...:<div id="div_1"...

于 2012-12-08T03:47:11.867 に答える
1

このようなことができます

var divId;

$('div').dblclick(function(e){
    e.preventDefault();
    divId = $(this).prop('id');
});
于 2012-12-08T03:47:30.347 に答える