Javascript 对图像进行灰度缩放，并重新引用原始图像

我知道如何对图像进行灰度处理。我正在使用jqueryaccordion，每个accordion头上都有图像。我想在手风琴处于活动状态时将图像更改为灰度，在手风琴处于非活动状态时将图像更改回其原始形式。我正在使用事件手风琴更改。问题是我无法保存原始图像。请帮忙。同样在灰度缩放之后，我尝试直接将原始src作为

document.getElementById("imgId").src = "images/pic.jpg";

---

这不起作用。

如果您使用的是jquery ui accordion，以下是答案：

//please note these are global variables
var imageArr=[];
var oldIndex = false;
var oldSrc;
$(document).ready(function(){

//grab all heading images 
imageArr = $("#accordion h3 img");

$( "#accordion" ).accordion({
    change: function(event, ui) { 
        active = ui.options.active;


        //restore clicked image
        if (oldIndex!==false) {
            $(imageArr[oldIndex]).attr("src",oldSrc);
        }

        //save current index for the future
        oldIndex = active;
        //save original src for the future
        oldSrc = $(imageArr[active]).attr("src")
        //implement some logic here to choose grayscale image and set the src value 
        $(imageArr[active]).attr("src","grayscale.png");
    }
});

})

---

如果您使用的是jquery ui accordion，以下是答案：

//please note these are global variables
var imageArr=[];
var oldIndex = false;
var oldSrc;
$(document).ready(function(){

//grab all heading images 
imageArr = $("#accordion h3 img");

$( "#accordion" ).accordion({
    change: function(event, ui) { 
        active = ui.options.active;


        //restore clicked image
        if (oldIndex!==false) {
            $(imageArr[oldIndex]).attr("src",oldSrc);
        }

        //save current index for the future
        oldIndex = active;
        //save original src for the future
        oldSrc = $(imageArr[active]).attr("src")
        //implement some logic here to choose grayscale image and set the src value 
        $(imageArr[active]).attr("src","grayscale.png");
    }
});

})

---

请发布其余代码，如果加载jquery，为什么不使用jquery sintaxt？是否使用jquery ui accordion插件？请发布其余代码，如果加载jquery，为什么不使用jquery sintaxt？是否使用jquery ui accordion插件？