在同一頁面上加載不同的設計

Question

我不知道這是可能的還是可以完成的，但我聽說並且看到人們已經使用AJAX和iFrames實現了它。

目前，我有我也有創造和設計了網頁的左側一個簡單的豎條：

我希望發生的是，當我點擊的項目之一，其編碼，如：

<div id='cssmenu'> 
     <ul> 
      <li class='active'><a href='index.html'><span>Home</span></a></li> 
      <li class='has-sub'><a href='#'><span>Products</span></a></li> 
       <li><a href='#'><span>Product 1</span></a></li> 
       <li><a href='#'><span>Product 2</span></a></li> 
       <li><a href='#'><span>Product 2</span></a></li> 
       <li><a href='#'><span>Product 2</span></a></li> 
       <li><a href='#'><span>Product 2</span></a></li> 
       <li><a href='#'><span>Product 2</span></a></li> 
       <li><a href='#'><span>Product 2</span></a></li> 
     </ul> 
    </div> 

當我點擊不同的側邊欄的鏈接我想不同的設計或頁面加載了，但在同一個Web表單中

這是可能的嗎？如果是這樣可以實現？

Answer 1

有趣，你有id="content"一個div哪些內容應該在它被加載：

$('.cssmenu').find('a').click(
    function(e) 
    { 
     e.preventDefault(); 
     $('#content').load($(this).attr('href')); 
    } 
); 

使用按鈕：

<input type="button" value="load content" id="loadtest"> 

和腳本：

$('#loadtest').click(function(){$('#content').load('test.aspx');});