基於url動態加載內容

Question

如何根據頁面的URL動態加載內容。

EG：profiles.html＃示例-contenet1，profiles.html＃示例-contenet2

對於每個＃示例-contenet負載不同頁面內容。

我試圖把它放到一個JSFiddle中，但是我認爲它可能需要一個php後端。 http://jsfiddle.net/JEUSz/3/

也許是這樣的：

switch ($_POST['name']) { 
case 'example-name1': 
    echo "<img src='img/pic.jpg' />"; 
    echo "<img src='img/pic.jpg' />"; 
    echo "hi"; 
    break; 
case 1: 
    echo "i equals 1"; 
    break; 
case 2: 
    echo "i equals 2"; 
    break; 
default: 
    echo 'fail'; 
    break; 
} 

Answer 1

即服務器端開發的整個目的。閱讀關於routing，並選擇PHP router like this爲例。

Answer 2

不，你不必使用PHP。您只需創建多個HTML文件並將其放入服務器即可。然後，您可以使用AJAX加載特定內容（與散列「＃some-name」相關）。

試試這個：

http://tutorialzine.com/2009/09/simple-ajax-website-jquery/

Answer 3

使用PHP，你可以使用查詢字符串找到變量來確定身體的內容。下面是一個小網站一個非常簡單的例子：

使用example.php含量= CONTACT_FORM

<?php 
$content = isset($_GET['content']) ? trim($_GET['content']) : 'default'; 

switch($content){ 
    case 'contact_form': 
     include('html/contact_form.php'); 
     break; 
    case 'welcome': 
     include('html/welcome.php'); 
     break; 
    default: 
     include('html/default.php'); 
} 

或者：

<?php 
$contentPages = array(
    'contact_form' => 'contact_form.php', 
    'welcome' => 'welcome.php', 
    'about' => 'about.php' 
); 

$content = 'default.php'; 
if(isset($_GET['content']) && array_key_exists($_GET['content'], $contentPages)){ 
    $content = $contentPages[$_GET['content']]; 
} 

include('html/' . $content); 

Answer 4

你的示例代碼是相當不錯的，但你必須使用變量而不是哈希標記。

所以不是profiles.html＃例如，contenet1，這將是profiles.html？名稱=例如，內容1

那麼你的switch語句將正常工作。

在$ _GET變量一些額外的信息：http://www.w3schools.com/php/php_get.asp

的URL的哈希標籤部分沒有被服務器，拿起的更多信息，你可以看看這個問題：

Can I read the hash portion of the URL on my server-side application (PHP, Ruby, Python, etc.)?

Answer 5

爲每個頁面使用js文件。

index.html => index.js 
guestbook.html => guestbook.js 

等等。那很好，因爲你需要在不同的頁面上有不同的實現。如果您想在頁面上共享功能，請使用global.js並在每個頁面中包含此文件。

Answer 6

這就是我的做法。在php文件中，我更改$ template。

//Get content 
$template = file_get_contents("main.html"); 

//Content based on _GET['page'] value 
switch($_GET['page']){ 
    case "home": //Form Page 
     include("inc/form_year.php"); 
     break; 
    case "company_register": //Form Page 
     include("inc/company_register.php"); 
     break; 
    case "confirm_user": 
     include("inc/confirm_user.php"); 
     break; 
    case "posts": 
     include("inc/posts.php"); 
     break; 
    case "question": 
     include("inc/question.php"); 
     break; 
    case "post_question": 
     include("inc/post_question.php"); 
     break; 
    case "post_answer": 
     include("inc/post_answer.php"); 
     break; 
    case "comment": 
     include("inc/comment.php"); 
     break; 
    case "create_post": 
     include("inc/create_post.php"); 
     break; 
    default: //Any page that is not defined in this switch will lead to this page 
     include("inc/form_year.php"); 
}