Javascript 和div1一起工作？奇怪；-）哈哈，对不起，js中的选择器有一个错误。修正了。我也有重复的id，只要你关闭第二个id，“#淡出”不会淡出。不管它是一个ID还是一个类。它工作得很好，代码没有太多变化。谢谢，但是现在它不适用于div1？奇怪；-）哈哈，对不起，

---

和div1一起工作？奇怪；-）哈哈，对不起，js中的选择器有一个错误。修正了。我也有重复的id，只要你关闭第二个id，“#淡出”不会淡出。不管它是一个ID还是一个类。它工作得很好，代码没有太多变化。谢谢，但是现在它不适用于div1？奇怪；-）哈哈，对不起，js中的选择器有一个错误。已修复。仍然存在重复的id

<div id="fade" class="black_overlay"></div>

<div id="openDiv" class="openDiv case1 col-xs-12">
  <div class="col-xs-12">
    <img src="https://placehold.it/100x50/ffffff/000000" alt="#" />
  </div>
  <div class="col-xs-12 content">
    <p>Some Stuff here</p>
  </div>
  <div id="light" class="white_content">
    <p>Case 1! More Stuff. Say Hello!</p>
    <a href="#" class="openDiv" id="closeDiv">Close</a>
  </div>
q</div>

<div id="openDiv" class="openDiv case2 col-xs-12">
  <div class="col-xs-12">
    <img src="https://placehold.it/100x50" alt="#" />
  </div>
  <div class="col-xs-12 content">

    <p>Some Stuff here</p>
  </div>
  <div id="light" class="white_content">
    <p>Case 2! More Stuff. Say Hello!</p>
    <a href="#" class="openDiv" id="closeDiv">Close</a>
  </div>
</div>

function clickCase() {

  $(".openDiv").click(function() {
   $("#light").toggle();
   $("#fade").toggle();

  });
 $("#closeDiv").click(function() {

   $("#light").toggle();
   $("#fade").toggle();
  });
}

<div id="fade" class="black_overlay"></div>

<div id="openDiv1" class="openDiv case1 col-xs-12">
  <div class="col-xs-12">
    <img src="https://placehold.it/100x50/ffffff/000000" alt="#" />
  </div>
  <div class="col-xs-12 content">
    <p>Some Stuff here</p>
  </div>
  <div id="light1" class="white_content">
    <p>Case 1! More Stuff. Say Hello!</p>
    <a href="#" class="openDiv" id="closeDiv">Close</a>
  </div>
</div>

<div id="openDiv2" class="openDiv case2 col-xs-12">
  <div class="col-xs-12">
    <img src="https://placehold.it/100x50" alt="#" />
  </div>
  <div class="col-xs-12 content">

    <p>Some Stuff here</p>
  </div>
  <div id="light2" class="white_content">
    <p>Case 2! More Stuff. Say Hello!</p>
    <a href="#" class="openDiv" id="closeDiv">Close</a>
  </div>
</div>



function clickCase() {

  $("#openDiv1").click(function() {
    $("#light1").toggle();
    $("#fade").toggle();

  });
  $("#openDiv2").click(function() {

    $("#light2").toggle();
    $("#fade").toggle();
  });
}


jQuery(document).ready(function() {
  clickCase();

});

function clickCase() {
  $(".openDiv").click(function() {    
        $(this).find("#light").toggle(); 
        $("#fade").toggle();
  });  

  $(".closeDiv").click(function() {
        $(this).find("#light").toggle();    
        $("#fade").toggle();   
  }); }

<div id="openDiv" class="openDiv case1 col-xs-12">
  <div class="col-xs-12">
    <img src="https://placehold.it/100x50/ffffff/000000" alt="#" />
  </div>
  <div class="col-xs-12 content">
    <p>Some Stuff here</p>
  </div>
  <div id="light" class="white_content">
    <p>Case 1! More Stuff. Say Hello!</p>
    <a href="#" class="openDiv closeDiv" id="">Close</a>
  </div>
</div>

<div id="openDiv" class="openDiv case2 col-xs-12">
  <div class="col-xs-12">
    <img src="https://placehold.it/100x50" alt="#" />
  </div>
  <div class="col-xs-12 content">

    <p>Some Stuff here</p>
  </div>
  <div id="light" class="white_content">
    <p>Case 2! More Stuff. Say Hello!</p>
    <a href="#" class="openDiv closeDiv" id="closeDiv">Close</a>
  </div>
</div>