2011-02-09 62 views
1

我想在我的頁面(page1)上放置一個圖像,該圖像是另一個頁面(page2)的鏈接,但我希望顯示的圖像是其中一個兩個可能的圖像,基於page2的內容。如何根據另一頁中的內容更改圖像鏈接

在這種情況下,Page2是一個報告當前狀態的wiki頁面。如果沒有問題需要報告,頁面1上的圖像將呈綠色。如果列出了問題,圖像將變爲紅色。

我的計劃是使用html註釋標籤在我的wiki頁面上嵌入<!--STATUSRED--><!--STATUSGREEN-->。然後我想我可以使用JavaScript,Jquery或類似的東西來檢查我的評論的存在,並相應地改變頁面1上的圖像。我只是不確定如何完全做到這一點。

我也接受其他想法。無論我提出什麼解決方案,維基用戶都必須更改,而不需要用戶更改page1(這不是維基的一部分)。

UPDATE:

我終於落得這樣做:

$(document).ready(function() { 
    statusCheck(); 
    setInterval(statusCheck,300000); 
} 

function statusCheck() { 
    $.ajax({ 
     type: "GET", 
     url: "path/to/wiki/MainPage.ashx", 
     dataType: "html", 
     cache: false, 
     success: function(html) { 
      $('#statusImage').attr('src', function() { 
       if ($(html).find("#statusGreen").length) 
       { 
        return '/images/green.gif'; 
       } 
       else 
       { 
        return '/images/red.gif'; 
       } 
      });   
     }, 
     error: function(request,status, error) { 
      $('#statusImage').attr('src', '/images/red.gif'); 
     }  
    }); 
} 

,然後wiki頁面上我只是改變了DIV id屬性的問題是 'statusGreen' 或' statusRed」像這樣:

<div id="statusGreen"> 
<font size="5" color="green">No issues to report.</font> 
</div> 

,我想改變形象得到了 'statusImage' ID:

<img id="statusImage" width="95" height="95" border="0" /> 
+0

如何確定第2頁此狀態?這是在服務器上完成的嗎?您可以指向第1頁上的單個圖像,並讓page2腳本將其更改爲紅色或綠色(例如,用適當的顏色替換服務器上的文件) – 2011-02-09 16:33:27

+0

第2頁上報告的狀態由wiki用戶手動更新。他們將不得不手動更改評論標記,然後腳本將不得不檢查此標記。 – JeffJ 2011-02-09 16:52:07

回答

0

這是因爲你得到所有的wiki頁面的內容,只檢查一個字的存在,反正挺浪費的,這裏是如何做到這一點:

<div id="hidden_container" style="display: none;"></div> 
<img src="" id="wikistatus"/> 

function set_status() { 
    var status_image = 'images/green.gif'; 
    $('#hidden_container').empty(); 
    $('#hidden_container').load('path/to/wiki.html #status', function() { 
    var status = $('#hidden_container').text(); 
    var is_green = status.indexOf('<!--STATUSGREEN-->'); 
    if(is_green === false) status_image = 'images/red.gif'; 
    $('#wikistatus').attr('src', status_image); 
    setTimeout('set_status();', 5000); // execute again in 5 seconds 
    }); 
} 

$(document).ready(function() { 
    set_status(); 
}); 

在wiki.html確保您status包裹的狀態碼在容器作爲ID:

<div id="status"><!--STATUSGREEN--></div> 
0

爲了使它更容易一點,你可以只添加一個參數(如果可能的話,這取決於你如何的控制力維基)

<a href="page2"><img src="page2?image" alt="" /></a>

而且具有wiki頁面返回正確的圖像直接,如果請求中包含參數「圖像」

+0

我對頁面2(wiki)的控制不如頁面1那麼多。我寧願讓開關邏輯在那裏發生。 – JeffJ 2011-02-09 17:59:46

相關問題