Jquery加载丢失CSS

时间：2016-06-17 11:42:49

标签： php jquery css css3

我需要更新div的内容，即便如此，也要完美。但是，当内容更新时，我将丢失更新的 css div。

$('#content').load('agenda.php?clinica='+data);

怎么样

enter image description here

应该是

enter image description here

任何人都知道我能做些什么来解决它？我知道如果我在正在加载的页面上添加所有 CSS ，问题就解决了，我认为这不是理想的解决方案，因为它会加倍 CSS < / em>的

接收更新的html页面。

<html class="st-layout ls-top-navbar ls-bottom-footer show-sidebar sidebar-l2" lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="description" content="">
  <meta name="author" content="">
  <title><?=$nomesite?></title>
  <link rel="shortcut icon" href="../images/favicon.ico" type="image/x-icon">
    <link rel="icon" href="../images/favicon.ico" type="image/x-icon">
  <link href="../css/vendor/all.css" rel="stylesheet">
  <link href="../css/vendor/magicsuggest.css" rel="stylesheet">
</head>
<body>
  <div class="st-container">
    <?php include 'navbar/navbar.php'; ?>
    <?php include 'chat/chat.php'; ?>
    <div class="st-pusher">
      <div class="sidebar left sidebar-size-2 sidebar-offset-0 sidebar-skin-blue sidebar-visible-desktop" id=sidebar-menu data-type=collapse>
        <div class="split-vertical">
          <div class="sidebar-block tabbable tabs-icons">
          </div>
          <div class="split-vertical-body">
            <div class="split-vertical-cell">
              <div class="tab-content">
                <?php include "menu/menu.php"; ?>
              </div>
            </div>
          </div>
        </div>
      </div>

      <div class="st-content" id="content"></div>

    </div>
    <? include ('../includes/footer.php');?>
  </div>
  </script>

 <script src="../js/vendor/all.js"></script>
 <script src="../js/app/app.js"></script>
 <script src="../js/app/jquery.mask.js"></script>
 <script src="../js/app/dentist.js"></script>
 <script>
  $(".setClinica").click(function(){
    $.ajax({
       type: "POST",
       url: "../ajax/setClinica.php",
       data:{
         nome:$(".setClinica").attr("name"),
         id:$(".setClinica").attr("id")
       },
       success: function(data){
         $('#tk-modal-demo').modal('toggle');
         $(".showModal").html($(".setClinica").attr("name"));

         $.get('../ajax/getSessionClinicaId.php', function(data)
         {
           $('#content').load('agenda.php?clinica='+data);
         });
       }
   });
  });
  </script>
</body>
</html>

这是我使用jquery load

带到页面的内容 
<div class="st-content-inner">
<div class="container-fluid">
  <h1>Agenda</h1>
  <div class="row">
    <div class="col-md-4 col-lg-3">
      <? if($_GET['clinica']){?>
      <div class="panel panel-default">
        <div class="panel-body">
          <strong><p class="text-center">Selecione o profissional</p></strong>
          <p class="lead text-primary margin-v-10">
          </p>
          <div class="form-group">
            <? $profissionais = $dados->Profissionais($_GET['clinica']); ?>
            <select id="profissionais" name="profissionais" class="selectpicker" data-style="btn-white" data-live-search="true" data-size="5">
            <option value="">Selecione</option>
            <? foreach($profissionais as $profissional){ ?>
              <option value="<?=$profissional->usuario?>"><?=$profissional->tratamento?> <?=$profissional->username?></option>
            <? } ?>
              </select>
          </div>
        </div>
      </div>
      <? } ?>
      <div id="picker" class="panel panel-default">
        <div id="datepicker" class="datepicker"></div>
      </div>
    </div>
    <div class="col-md-8 col-lg-9">
      <div id="agenda">
      </div>
    </div>
  </div>
</div>
</div>

1 个答案:

答案 0 :(得分：0)

根据您提供的屏幕截图，我觉得您正在使用plugin select元素。因此，当您使用$.load时，您实际上在DOM准备好并且plugin已经初始化之后加载了一些内容。因为，callback完成后您可以load，re-initialize内的select plugin实际上可以callback。以下是你可以做的.. 

$('#content').load('agenda.php?clinica='+data,function(){
       //callback function 
       //re-initialize anything here again
});
相关问题
最新问题