Question

多个图像的Html（我试图使用一个模态的所有图像），并且必须根据所选图像模态显示特定信息。

  <div id = "items">
  <li id="item">
    <a><img src="images/items/Meat Nugget.png" />
  </li>
  <li id="item">
    <a><img src="images/items/Bustling Fungus.png" />
  </li>

用于触发点击元素的JavaScript

(function(){
  var $content = $('#share-options').detach();  

  $('#item').on('click', function() {           
    modal.open({content: $content, width:340, height:300});
  });
}());

Answer 1

这是因为ID对于单个元素是唯一的，因此每个页面只能有一个具有该ID的元素。您可以通过使用类来解决此问题，您可以在多个元素上使用相同的类。

<div id = "items">
  <li class="item">
    <a><img src="images/items/Meat Nugget.png" />
  </li>
  <li class="item">
    <a><img src="images/items/Bustling Fungus.png" />
  </li>

引用课程时，您需要使用。（类选择器）而不是＃（ID选择器）

$('.item').on('click', function() {           
    modal.open({content: $content, width:340, height:300});
  });
}());

模态窗口仅使用第一个元素打开，而不是第二个或第三个元素

1 个答案: