2015-09-06 53 views
0

我有一組「li」。點擊這些「li」中的每一個,我想從html頁面加載一個帶有內容的「div」。我已經閱讀了一些在stackoverflow &的答案嘗試了他們,但他們沒有幫助我得到這個工作。將html或div的內容加載到div中

下面的代碼現在想

<!doctype html> 
<html lang=''> 
    <head> 
     <meta charset='utf-8'> 
     <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
     <meta name="viewport" content="width=device-width, initial-scale=1"> 
     <link rel="stylesheet" href="styles.css"> 
     <script src="http://code.jquery.com/jquery-latest.min.js" type="text/javascript"></script> 
     <script type="text/javascript"> 
     $(document).ready(function(){ 
     $("#page1").click(function(){ 
      $('#result').load('dst.html'); 
      //alert("Thanks for visiting!"); 
     }); 

     $("#page2").click(function(){ 
      $('#result').load('incf.html'); 
      //alert("Thanks for visiting!"); 
     }); 
     }); 
    </script> 
    </head> 
    <body> 
     <header class="site-header-wrap"> 
     <div class="site-header"> 
      <h1>MY TOOL</h1> 
     </div> 
     </header> 
     <div id='cssmenu'> 
     <ul> 
      <li class='active'><a href='#'><span>HOME</span></a></li> 
      <li><a id="page1" href="#"><span>OPTION 1</span></a></li> 
      <li><a id="page2" href="#"><span>OPTION 2</span></a></li> 
      <li><a id="page3" href="#"><span>OPTION 3</span></a></li> 
     </ul> 
     </div> 
     <div id="result"></div> 
    </body> 
<html> 

在dst.html的代碼是

<html lang=''> 
    <body> 
     <p> In page 1(dst page) </p> 
    </body> 
<html> 

我能請求幫助,請找出我在做什麼錯在這裏?

+0

請檢查任何路徑錯誤,控制檯中的其他錯誤。 – sajanyamaha

回答

1

您的代碼似乎工作大部分我,我在你的代碼改變的唯一事情就是$('#dblock').load('dst.html');$('#result').load('dst.html');因爲不存在與該ID不派息#dblock

也確保你的文件結構的設置是否正確和HTML文件在那裏,你有什麼設置現在你應該有三個HTML文件在同一個文件夾中

+0

Hello NooBskie - 現在好了。謝謝你堆和噸。問題在於Chrome!它正在使用Firefox。目前我主要使用Chrome工作數月。所以,這並不意味着這可能是一個瀏覽器問題。 – User12345