Question

我有一个产品列表，其中每个产品在一个div中都有一个数字。根据这个数字我需要显示另一个div。这根本不起作用。

JS

if ($('.producerId').html() == 1) {
$(".one").show();
}
if ($('.producerId').html() == 2) {
$(".two").show();
}
if ($('.producerId').html() == 3) {
$(".three").show();
}

HTML

<div class="producerId">2</div>
<div class="producerImage">
<div class="one">one</div>
<div class="two">two</div>
<div class="two">three</div>
</div>
<div class="producerId">1</div>
<div class="producerImage">
<div class="one">one</div>
<div class="two">two</div>
<div class="two">three</div>
</div>
<div class="producerId">3</div>
<div class="producerImage">
<div class="one">one</div>
<div class="two">two</div>
<div class="two">three</div>
</div>

Here's fiddle

Answer 1

您需要隐藏课程.one，.two和.three而不是其父div .producerImage，您可以使用{{1}隐藏} switch case使用类$.each循环所有div，如下所示：

<强> DEMO

producerId

<强> CSS

$(document).ready(function(){
    $.each($('.producerId'),function(){
       var value=$(this).html();
       var that=$(this);
       switch(value)
       {
           case "1":
                   that.next().find($('.one')).show();
               break;
           case "2":
                   that.next().find($(".two")).show();
               break;
           case "3":
                   that.next().find($(".three")).show();
               break;
           default:
               break;

       }
    });
});

有2个.one,.two,.three { display:none; } divs和two具有相同的类。您已为两者提供three：

更新了two

html

JQuery根据另一个div中的值显示div

1 个答案: