当另一个DIV被点击时，不能让DIV变为.fadeout()

Can't Get DIVs To .fadeOut() When Another DIV Is Clicked

本文关键字：DIV 变为 fadeout 不能 另一个      更新时间：2023-09-26

我试图让用户双击一个图标，然后一个与图标的类值相同的id值的div淡出。我有一些工作，但由于某种原因，它只适用于第一个DIV。这是我当前的代码:

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

您可以在这里看到它的作用:http://jsfiddle.net/TheInfection/JpMRC/

那是因为你对几个元素使用一个ID, ID必须是唯一的，只有第一个具有特定ID的元素被jQuery选择，你应该使用class es或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/

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);
});
我觉得之前的决定更好。
相关文章：