在jQuery模态中显示成功消息

时间:2018-09-05 09:22:29

标签: php jquery


我想在回显$成功时,在jquery模态中显示该按摩。

这是我的PHP代码

  <?php $success = "perfect!!!"; ?>

  <?php if (!empty($success)) : ?>
        <div class="success"><?php echo $success; ?></div>
  <?php else : ?>
  <div class="error">
        <p><?php echo $error; ?></p>
  </div>
  <?php endif ?>

这是我的模态代码

  <p><a class="btn" href="#ex8">Open Modal</a></p>
  <div id="ex8" class="modal">
     <p>This modal starts fading in once the overlay is 50% faded in.</p>
  </div>

   <script>
   $('#ex8').on(function(event) {
      event.preventDefault();
        $(this).modal({
           fadeDuration: 1000,
           fadeDelay: 0.50
      });
   });
   </script>

2 个答案:

答案 0 :(得分:0)

将您的成功消息置于模式中。

<p><a class="btn" href="#ex8">Open Modal</a></p>
<div id="ex8" class="modal">
<?php if (!empty($success)) : ?>
    <div class="success"><?php echo $success; ?></div>
<?php else : ?>
    <div class="error">
        <p><?php echo $error; ?></p>
    </div>
<?php endif; ?>
<p>This modal starts fading in once the overlay is 50% faded in.</p>
</div>

编辑1-

如果要在使用页面加载时打开模式-

<script type="text/javascript">
    $(window).on('load',function(){
        $('#ex8').modal();
    });
</script>

如果要在设置成功消息时打开模式,请使用-

<?php if (!empty($success)) : ?>
    <script type="text/javascript">
        $(window).on('load',function(){
            $('#ex8').modal();
        });
    </script>
<?php endif; ?>

答案 1 :(得分:0)

如果您打算自动显示模式,可以将 $(“#ex8”)。modal();