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

那是因为您为多个元素使用一个 ID,ID 必须是唯一的,jQuery 只选择具有特定 ID 的第一个元素,您应该使用classes 或data-*attributes 代替。

<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: previous decision is better, I think.

于 2013-03-10T19:24:23.590 回答