Question

我有一个div弹出脚本，按预期工作 - see working version here。我想在php循环中使用这个代码，但似乎div id是一个固定的引用，因此我不能在循环中使用它，因为div id只能被引用一次。

我正在寻找一种解决方案，以某种方式允许jquery弹出脚本支持动态div id但不知道如何做到这一点。

这是我的html / php代码，我可以在其中指定动态div id：

$counter是一个数字，每个循环的数字都会增加，即inline-popups1，inline-popups2等。

$content = "<!-- Jquery reference -->
<div id='inline-popups".$counter."'>

<!-- Popup link -->
    <a href='#popup".$counter."'>Popup Link</a>
  </div>

<!-- Popup itself -->
<div id='popup".$counter."' class='white-popup mfp-with-anim mfp-hide'>
  <p>content goes here</p>
</div>";

这是jquery - 你可以看到$('#inline-popups')是一个固定的引用。我需要它来支持动态引用，如上所示。

// Inline popups
$(document).ready(function() {
    $('#inline-popups').magnificPopup({
      delegate: 'a',
      removalDelay: 500, //delay removal by X to allow out-animation
      callbacks: {
        beforeOpen: function() {
           this.st.mainClass = this.st.el.attr('data-effect');
        }
      },
      midClick: true // allow opening popup on middle mouse click. Always set it to true if you don't provide alternative source.
    });
});

Answer 1

您可以使用startsWith所述的$("[id^='inline-popups']") CSS属性选择器：

<a href="php/viewh.php">

但你应该/可以使用课程。

如何启用jquery脚本来支持动态ID

1 个答案: