如何将HTML指定类的URL传递到模态框内按钮的锚标签中？

先给模态框里的目标<a>标签加个唯一ID，方便JS精准定位，比如：

<!-- 模态框内的按钮链接 -->
<a id="modal-action-link" href=""><button>Click Here</button></a>

接着修改点击事件代码，把触发链接的URL赋值给模态框内的链接即可，替换你原来给iframe赋值的逻辑：

<!-- 触发模态框的链接 -->
<a class="sent" href="<?php echo $row->play; ?>">打开模态框</a>

<!-- 模态框结构示例 -->
<div id="myModal" class="modal">
  <div class="modal-content">
    <!-- 模态框内的按钮链接 -->
    <a id="modal-action-link" href=""><button>Click Here</button></a>
  </div>
</div>

<script>
$(document).ready(function() {
  // 点击带sent类的链接时执行
  $('.sent').on('click', function(e) {
    e.preventDefault(); // 阻止链接默认跳转行为
    var targetUrl = $(this).attr('href'); // 获取当前链接的URL
    $('#myModal').modal('show'); // 打开模态框
    $('#modal-action-link').attr('href', targetUrl); // 把URL赋值给模态框内的链接
  });

  // 模态框关闭时清空链接，避免残留旧URL
  $("#myModal").on('hidden.bs.modal', function(e) {
    $("#modal-action-link").attr("href", '');
  });
});
</script>

关键说明 #

• 给目标链接加ID是为了避免影响页面其他<a>标签，确保只修改模态框内的指定链接
• e.preventDefault()用来阻止触发链接的默认跳转，保证点击后只打开模态框
• 模态框关闭时清空href，防止下次打开时还保留上次的URL

内容的提问来源于stack exchange，提问作者enzer