javascript - 使用 AJAX 在 Bootstrap Modal 上调用 PHP 函数

Question

我使用 PHP 循环在我的页面上回显了一个用户列表。当我单击每个用户的名称时，会弹出一个 Bootsrap 模式并显示该用户的更多详细信息。链接看起来像这样。

<a href="#user"  data-toggle="modal"  data-id="{$user['id']}">UserName</a>

如您所见，我将用户 ID 传递给 Bootstrap 模态，以便我可以通过在 Bootstrap 模态中调用 get_user_by_id() 来使用它来检索用户的其他信息。

模态看起来像这样

<div class="modal fade" id="user">
    <div class="modal-header">
        <button class="close" data-dismiss="modal">×</button>
        <h3>Modal header</h3>
    </div>
    <div class="modal-body">
        <?php
          $user = get_user_by_id($id);
         ?>
        <input type="text" name="bookId" id="bookId" value=""/>
    </div>
</div>

JS代码是这样的

$('#user').on('show.bs.modal', function (event) {
   var button = $(event.relatedTarget)
   var id = button.data('id')
})

根据上面的 JS 代码，我在 var id 变量中有我的用户 ID。但是，我无法想象如何将上述 PHP 函数的值用作参数。

有什么办法吗？

我已经编辑了问题，使大多数答案基于 AJAX 的 AJAX 方法更加独特

PS:我对 PHP 和 Bootstrap 还很陌生。

Answer 1

您将要使用 ajax运行 PHP。正如@Tom 所说，在 DOM 中加载后，javascript 无法访问 PHP。 PHP 是一种服务器端语言，只能这样访问。

一旦您通过 ajax 连接到 PHP，您就可以使用返回的内容加载 div。只有在内容加载后才应打开模态框，否则您会看到框出现时跳动的样子，然后内容才出现。

基本示例

$(".btn").click(function(){
    // AJAX code here.
    $.ajax(
    ....
    success: function($data){
      $('.target').html(data)
      $("#myModal").modal('show');
    }
    );
});