Question

如何使用jquery更改充当jquery移动弹出窗口的div的id以及指向弹出窗口的锚点的href？

在我的webapp中，我有一个锚点，当点击它时，会弹出一个jquery移动弹出窗口div，所有这些都是我动态插入的。在webapp的任何实例中，我不知道将插入此代码的次数。因此，我的理解是我需要能够为jquery mobile popup div动态创建一个唯一的id并设置我的弹出图标的href。

我目前无法成功动态更改id和href。我创建了以下测试（JSFiddle Test）。

这是我的示例html：

<div class="phone1">
  <p class="textLeft"> <strong>Number: </strong><span>(555)555-5555</span>
    <a href="#myPopup" data-rel="popup" data-transition="pop" class="my-tooltip-btn ui-corner-all ui-btn ui-alt-icon ui-nodisc-icon ui-btn-inline ui-icon-info ui-btn-icon-notext ui-corner-all" title="Learn more">Learn more</a>
  </p>
    <div id="myPopup" data-role="popup" class="ui-content" data-theme="a" style="max-width:350px;">
      <p class="flagText">This number has been flagged as incorrect</p>
    </div>
</div>
<a href="#" class="ui-btn ui-btn-inline ui-btn ui-mini ui-corner-all ui-shadow" id="changeButton">Change href property</a>

这是我的示例javascript / jquery：

$('#changeButton').click(function () {
    alert("Handler for .click() called.");
    $('.phone1 > a').prop('href', 'myNewPopup');
    $('#myPopup').attr('id', 'myNewPopup');
});

提前感谢您的帮助！

Answer 1

由于您的主播不是.phone1的直接孩子而是孙子，因此＆gt;选择器不起作用。 href也需要＃符号：

$('.phone1 a').prop('href', '#myNewPopup');

从技术上讲，你也应该使用prop来更新id：

$('#myPopup').prop('id', 'myNewPopup');

更新了 FIDDLE

您确定需要这样做吗？在第一次动态插入弹出窗口后，您可以通过测试它是否首先存在于DOM中来每次连续更新它：

if ($("#myPopup").length > 0){
    //update
} else {
    //create
}

更改指向popup id jquery Mobile的href属性

1 个答案: