1

ユーザーがアイコンをダブルクリックすると、アイコンのクラス値と同じID値を持つDIVがフェードアウトするようなものを作成しようとしています。私はそのような作品を持っていますが、何らかの理由でそれは最初のDIVでのみ機能します。これが私の現在のコードです：

$('#icon').on('dblclick', function() {
    var app = $(this).attr('class');
    $('#' + app + '').fadeOut(200);
});

ここで実際の動作を確認できます：http：//jsfiddle.net/TheInfection/JpMRC/

4

2 に答える 2

2

これは、複数の要素に1つのIDを使用しているためです。IDは一意である必要があり、特定のIDを持つ最初の要素のみがjQueryによって選択されます。代わりに、 classesまたはdata-*属性を使用する必要があります。

<div data-target="one" class="icon">one</div>
<div data-target="two" class="icon">two</div>
<div data-target="three" class="icon">three</div>

<div id="one" class="box">One</div>
<div id="two" class="box">Two</div>
<div id="three" class="box">Three</div>


$('.icon').on('dblclick', function() {
    var target = $(this).data('target');
    $('#' + target).fadeOut(200);
});

http://jsfiddle.net/VqWJp/

于 2013-03-10T19:14:17.573 に答える
0

html：

<div class="icon one"></div>
<div class="icon two"></div>
<div class="icon three"></div>

<div id="one" class="box">One</div>
<div id="two" class="box">Two</div>
<div id="three" class="box">Three</div>

js：

$('.icon').on('dblclick', function() {
    var app = $(this).attr('class').split(' ')[1];
    $('#' + app).fadeOut(200);
});

upd：以前の決定の方が良いと思います。

于 2013-03-10T19:24:23.590 に答える