我想在我的页面(第1页)上放置一个图像,该图像是指向另一个页面(第2页)的链接,但我希望显示的图像是基于page2内容的两个可能图像之一。 / p>
在这种情况下,Page2是一个报告当前状态的Wiki页面。如果要报告没有问题,第1页上的图像将为绿色。如果列出了问题,图像将显示为红色。
我完成此操作的计划是使用html评论标记在我的维基页面上嵌入<!--STATUSRED-->
或<!--STATUSGREEN-->
。然后我想我可以使用javascript,Jquery或类似的东西来检查我的评论的存在并相应地改变第1页上的图像。我只是不确定如何做到这一点。
我也对其他想法持开放态度。无论我提出什么解决方案,维基用户都必须简单地进行更改,而无需用户更改page1(这不是维基的一部分)。
更新
我最终做了什么:
$(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');
}
});
}
然后在维基页面上我只是将div上的id属性更改为'statusGreen'或'statusRed',如下所示:
<div id="statusGreen">
<font size="5" color="green">No issues to report.</font>
</div>
我要更改的图片会获得'statusImage'标识:
<img id="statusImage" width="95" height="95" border="0" />
答案 0 :(得分:0)
为了让它更容易一点,你可以添加一个参数(如果可能的话,取决于你对wiki的控制程度)
<a href="page2"><img src="page2?image" alt="" /></a>
如果请求包含参数“image”
,请让wiki页面直接返回正确的图像答案 1 :(得分:0)
这非常浪费,因为你只需要检查所有维基页面的内容,只检查单个单词的存在,无论如何,这里是如何做到的:
<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>