Question

我想在我的页面（第1页）上放置一个图像，该图像是指向另一个页面（第2页）的链接，但我希望显示的图像是基于page2内容的两个可能图像之一。 / p>

在这种情况下，Page2是一个报告当前状态的Wiki页面。如果要报告没有问题，第1页上的图像将为绿色。如果列出了问题，图像将显示为红色。

我完成此操作的计划是使用html评论标记在我的维基页面上嵌入或。然后我想我可以使用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" />

Answer 1

为了让它更容易一点，你可以添加一个参数（如果可能的话，取决于你对wiki的控制程度）

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

如果请求包含参数“image”

，请让wiki页面直接返回正确的图像

Answer 2

这非常浪费，因为你只需要检查所有维基页面的内容，只检查单个单词的存在，无论如何，这里是如何做到的：

<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>

如何根据其他页面中的内容更改图像链接

2 个答案: