在Listview中遇到jQueryMobile弹出窗口问题

Question

所以我正在尝试制作缩略图列表视图，当用户点击一个按钮时，每个按钮会弹出不同的弹出窗口，但我的问题是每个按钮都会在列表中的每个按钮的第一个弹出窗口中显示相同的信息。我做错了什么？

<div data-role="listview">
  <li>
                <a href="#codeSample" data-rel="popup" data-transition="slide" data-position-to="codeSample">
                <h1>Song1</h1>
                <img src="image" />
                <p>Artist1</p></a>

<div data-role="popup" id="codeSample">

  <p>Artist1 Bio</p>
</div>

  </li>
    <li>
                <a href="#codeSample" data-rel="popup" data-transition="slide" data-position-to="codeSample">
                <h1>Song2</h1>
                <img src="image" />
                <p>Artist2</p></a>

<div data-role="popup" id="codeSample">

  <p>Artist2 Bio</p>
</div>

  </li>

</div>

Answer 1

您需要为弹出窗口提供不同的ID。

你有：

<div data-role="popup" id="codeSample">

两个弹出窗口都是

。

给他们一个不同的id并适当地调用所需的id。