JQuery .Load not loading css

我開始使用PHP，，AJAX和CSS開發網站。JQuery .Load not loading css

我第一次嘗試使用，因爲所有包含主HTML內jeasyui的標籤，一切都很好..

在這裏你可以看到的jQuery EasyUI教程

<body> 
<h2>Nested Tabs</h2> 
<div class="demo-info"> 
    <div class="demo-tip icon-tip"></div> 
    <div>The tab panel can contain sub tabs or other components.</div> 
</div> 
<div style="margin:10px 0;"></div> 
<div class="easyui-tabs" data-options="tools:'#tab-tools'" style="width:700px;height:250px"> 
    <div title="Sub Tabs" style="padding:10px;"> 
     <div class="easyui-tabs" data-options="fit:true,plain:true"> 
      <div title="Title1" style="padding:10px;">Content 1</div> 
      <div title="Title2" style="padding:10px;">Content 2</div> 
      <div title="Title3" style="padding:10px;">Content 3</div> 
     </div> 
    </div>

提取代碼正如你所看到的一切工作正常，因爲它包含在同一個html中...

現在我試圖在不同的文件中劃分事物以獲得一切更有條理......（這裏您可以看到index.html）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
<link rel="stylesheet" type="text/css" 
    ref="http://www.jeasyui.com/easyui/themes/default/easyui.css"> 
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css"> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"></script> 
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"> 
</script> 
    <script type="text/javascript" src="http://www.jeasyui.com/easyui/datagrid-detailview.js"> 
</script> 

    <script type="text/javascript" src="connections.js"></script> 
    <script type="text/javascript" src="codigo.js"></script> 

    <script language="javascript"> 

    $(document).ready(function(){ 

     $("#linkajax").click(function(evento){ 

      evento.preventDefault(); 
      //$(document).getElementById('resultado').innerHTML='sales.html'; 

      $("#resultado").load("sales.html"); 

     }); 
    }) 
    </script> 
    </head> 

<body > 
<div id="main" class="easyui-tabs" style="border:0;width:auto;height:700px;"> 
    <div title="Tab 1" iconCls="icon-reload" closable="false" onClick="listTab1()" 
style="padding:10px;"> 
     Tab 1 
        <table id="tab1_table" style="width:900px;height:650px"></table> 
    </div> 
      <div id="resultado" title="Tickets" iconCls="icon-reload" closable="false" style=" 
padding:10px;"> 
       <a href="#" id="linkajax">Click</a> 

    </div> 


</div> 
</body> 
</html>

這裏... sales.html

<link rel="stylesheet" type="text/css" 
href="http://www.jeasyui.com/easyui/themes/default/easyui.css"> 
<html> 
<head> 
      <link rel="stylesheet" type="text/css" 
href="http://www.jeasyui.com/easyui/themes/default/easyui.css"> 
<link rel="stylesheet" type="text/css" href="http://www.jeasyui.com/easyui/themes/icon.css"> 
    <link rel="stylesheet" type="text/css" href="style.css"> 
      <script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.min.js"> 
</script> 
<script type="text/javascript" src="http://www.jeasyui.com/easyui/jquery.easyui.min.js"> 
</script> 
    <script type="text/javascript" src="http://www.jeasyui.com/easyui/datagrid-detailview.js"> 
</script> 


</head> 
<body > 

    <div id="main2" class="easyui-tabs" style="border:0;width:auto;height:700px;"> 
    <div title="Tab 1" iconCls="icon-reload" closable="false" style="padding:10px;"> 
     Tab 1 
    </div> 
      <div title="Tickets" iconCls="icon-reload" closable="false" style=" padding:10px;"> 
        Tab 2 
    </div> 


</div> 


</body>

這裏..結果

Result

在這裏你可以看到，嵌套的標籤沒有CSS！...

有沒有人有任何建議？

來源

2013-04-09 Ppp

將鏈接標籤移動到頭部。 – 2013-04-10 11:20:17

我不明白你說什麼關於移動鏈接標籤內頭... – Ppp 2013-04-10 13:27:43

在sales.html，我認爲你也可以只留下與內容的div在那裏，你有沒有試過這樣嗎？ – 2013-04-10 14:42:11

將sales.html重命名爲sales.php，然後像這樣調用jQuery。

<script language="javascript"> 

$(document).ready(function(){ 

    $("#linkajax").click(function(evento){ 

     evento.preventDefault(); 
     //$(document).getElementById('resultado').innerHTML='sales.html'; 

     $("#resultado").load("sales.php"); 

    }); 
}) 
</script>

您也可以在sales.php中'回顯'您的所有代碼。

希望它可以幫助你。

來源

2013-04-10 10:31:48

Nop ..只是相同的結果。 – Ppp 2013-04-10 13:28:01

我不確定我的經驗是否可以幫助，但是，我遇到了類似的問題並修復了它。

我正在使用easyui面板根據用戶選擇加載不同的內容。起初，我用

$('#panel').load('user_selection.html')

加載不同的內容。但內容顯示沒有easyui效果。

然後我改

$('#panel').panel('refresh','user_selection.html')

，然後它工作正常。

希望這可以幫助。

原因，恕我直言，是easyui的面板 - >刷新功能可以觸發一些easyui腳本來呈現新加載的內容，而jquery的load（）函數不能。

來源

2014-04-09 14:13:33

JQuery .Load not loading css

回答

相關問題