Question

我使用mysql和php，我为用户创建了一个单页user.php，其中每次在同一页面上的任何链接都通过php更新中心<div>内容点击。如果我不清楚，当用户点击user.php侧栏中的链接时，会发送一个特定变量与页面链接，如user.php?form，然后如果form不为空，中心<div>带来形式展示。这工作正常，但对于某些链接，我没有使用这种方法，我使用模态而不是。当一个特定的变量不为空时，php调用一个函数modal()，在另一个methods.php文件中声明，而modal根据函数调用传递的参数提供所需的内容，除此之外的所有内容都很有效，除了模态的背景，首先它是模态内容，但在我设置它z-index:-1之后它又回到了背后但模态背后的一些内容不在背景下，如按钮，标题，输入字段的亮度与是模态的。我搜索了它，发现＆＃34;将模态附加到身体＆＃34;解决方案，但我的模态不在我的页面上，它是通过PHP从一个单独的文件调用。我只想让背景覆盖所有应有的元素。模态的屏幕截图附有here。

我的user.php文件，它根据特定变量调用模态

<div class="col-sm-10" style="padding-right: 0px;padding-left: 0px;">
<?php
$result2 = mysql_query("select * from users where username = '$username'")
or die("failed to query database".mysql_error());
$row2 = mysql_fetch_array($result2);
    if(isset($_GET['pwd']) && !isset($_GET['done']))
    {
      $userId=$row2['Id'];
      $value=4;
      $s=4;
      modal($value,$userId,$s);
    }
    if(isset($_GET['noti']))
    {
      $_SESSION['visited']=true;
      notific($username);
    }
    else if(isset($_GET['home']))
    {
      home();
    }
    else if(isset($_GET['about']))
    {
      about();
    }
    else if(isset($_GET['contact']))
    {
      contact();
    }
    else
      submitForm(0);
    ?>
</div>

和methods.php文件，其中包含模态声明，user.php文件只调用pwd的模态，但我使用了除用户以外的面板中的相同modal()函数，这解释了常量模态体中的价值检查。

function modal($value,$idnum,$s)
    {
        echo  '<script>
                    $(function() {
                     $("#myModal").modal("show");
                    });
                </script>
                <div class="modal fade" id="myModal" role="dialog"    >
                    <div class="modal-dialog" role="document">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal">&times;</button>
                                <h4 class="modal-title">';
                        if($s==1 || $s==2)
                          echo 'Closing Details';
                        else if($s==4)
                          echo 'Edit Account';
                        else if($s==3)
                          echo 'Confirm?';
                        else if($s==5)
                          echo 'Add New Case';
                        echo '</h4>
                            </div>
                            <div class="modal-body">
                                <div class="fetched-data clearfix">';
                          if($s==6)
                            addCr();
                          else if($s==5)
                            submitForm(1);
                          else if($s==4)
                            pwdChange($idnum,$value);
                                else if($s==2)                              
                                        display($idnum);
                                    else if($s==1)
                                        form($idnum);
                                echo'</div> 
                            </div>
                        </div>
                    </div>
                </div>';
        if($value==1)
            allRecords();
    else if($value==2 || $s==6)
      criminals();
        else if($s!=4 && $s!=5)
            oneRecord($value);
    else if($s==5)
      allRecords();
    }

我似乎找不到导致这种情况的原因，我甚至尝试设置输入字段＆＃39; z-index为负数，但没有任何变化。附：我知道我不会＆＃34;假设＆＃34;使用mysql，所以现在请给我这个建议，感谢任何帮助，谢谢

Answer 1

HTML和底层CSS输出有助于更好地理解问题。但是，我已经创建了一个codepen供您参考。 https://codepen.io/mburnette/pen/bVWaOO

模态被定义为

.modal{
  position: fixed;
  z-index: 1050;
}

除非具有z-index的非静态定位元素＆gt; 1050放在那里应该没有问题。我还看到模态对话框不是居中对齐的。我假设，.modal的CSS已经被CSS覆盖了。

Bootstrap模态背景未覆盖按钮和字段

1 个答案: