javascript - PHP & Ajax , Javascript - 如何在将数据而不是文本提取到数据库中时显示模态

Question

如何获取数据并将其显示为模态弹出窗口而不是文本，

问题来了，因为这段代码

错误

数据库结构

index.php

    <!-- The Modal -->
<div id="myModal" class="modal">


 ?>


</div>


    <script type="text/javascript">
    $.ajax({
        type: "GET",
        url: "select.php", //create a php for the SELECT STATEMENT
        //data: $("#signin").serialize(), // serializes the form's elements.
        success: function (data) {
            $("#myModal").html(data);
            modal.style.display = "block";
        }
    });

</script>

这里是第二个页面是select.php这里是获取模态的地方

select.php

<?php 

$link=mysqli_connect("localhost","root","");
mysqli_select_db($link, "autorefresh");

$res = mysqli_query($link,"select * from table1");

while($row=mysqli_fetch_array($res))
{
    echo '  <div class="modal-content">
            <span class="close">&times;</span>
            <p>'.$row["name"]." ".$row["city"].'</p>
          </div>';
}

Answer 1

你没有定义什么是modal....试试这行，

success: function (data) {
            $("#myModal").html(data);
            $("#myModal").slideDown('slow');
        }

$("#myModal").slideDown('slow'); 行将显示带有 slideDown 效果的模型。您也可以使用 $("#myModal").css('display','block'); 来显示而不是 slideDown 效果。

模态弹出

要创建一个模态弹出窗口，您需要使用bootstrap。将 boostrap 添加到您的项目然后试试这个，

<div id="myModal" class="modal fade" role="dialog">
  <div class="modal-dialog">

    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Modal Header</h4>
      </div>
      <div class="modal-body">

      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
      </div>
    </div>

  </div>
</div>

在你的 javascript 中，

success: function (data) {
                $("#myModal .modal-body").html(data);
                $("#myModal").modal('show');
            }

行 $("#myModal").modal('show'); 将弹出模式。