Question

我有一系列具有相似ID的div，除了最后一个唯一的＃（cartbtn0，cartbtn1等）。我创建了一个通用函数，它将使用通配符在所有div中工作，但是我需要能够捕获被单击的div的唯一＃，以便替换＃cartbox0：hidden中的0。有人可以帮忙吗？

示例代码：

$("*[class^=cartbtn]").click(function () {  
    $(this).hide();  
    $('#cartbox0:hidden').fadeIn(2000);  
});

<div id="cartbtn0" class="cartbtn0">.....</div>  
<div id="cartbox0>" class="cartbox0" style="display:none;">.....<div>  

<div id="cartbtn1" class="cartbtn1">Text</div>  
<div id="cartbox1>" class="cartbox1" style="display:none;">Text<div>

Answer 1

您可以使用：

this.id

在点击处理程序中。

Answer 2

为了避免操纵字符串（你当然可以做$(this).attr('id').substring(...），我会说你最好的选择是：

$(this).find(':hidden').fadeIn(2000);

如果它被隐藏，那将为你提供点击的div。虽然我不太明白为什么你会想要搜索它，因为你总是在它之前隐藏它。

Answer 3

尝试

$('#'  & this.id.replace('cartbtn','cartbox') + ':hidden').fadeIn(2000);

而不是

$('#cartbox0:hidden').fadeIn(2000);

应该取div，并替换名称。

Answer 4

我假设您正在动态创建这些div。如果是这种情况，您可以为它们添加一个属性，用于保存数字。然后，您可以在单击时访问该属性并将其附加到类的末尾。这样可以避免操作类名字符串。

$("*[class^=cartbtn]").click(function () {  
    $(this).hide();
    var num = $(this).attr('ref');  
    $('#cartbox'+num+':hidden').fadeIn(2000);  
});

<div id="cartbtn0" class="cartbtn0" ref="0">.....</div>  
<div id="cartbox0" class="cartbox0" ref="0" style="display:none;">.....<div>  

<div id="cartbtn1" class="cartbtn1" ref="1">Text</div>  
<div id="cartbox1" class="cartbox1" ref="1" style="display:none;">Text<div>

传递div信息

4 个答案: