Javascript 如何更改Go.js中节点的文本

我习惯于画图表。一切都很好，但现在我想编辑像颜色的文本。为此，我制作了一个

textarea

。我已经这样做了，但问题是当我更改一个节点的文本时，它会更改我先前选择的其他节点的文本。不知道我错在哪里。这是我的密码：

 var info = document.getElementById("myInfo");
    myDiagram.addDiagramListener("ChangedSelection", function(e1) {
        var sel = e1.diagram.selection;
        var str = "";
        if (sel.count === 0) {
            str = "Selecting nodes in the main Diagram will display information here.";
            info.innerHTML = str;
            return;
        } else if (sel.count > 1) {
            str = sel.count + " objects selected.";
            info.innerHTML = str;
            return;
        }
        // One object selected, display some information
        var elem = sel.first();

        var shape = elem.findObject("SHAPE");
        var txtblock = elem.findObject("TEXT");
        str += "<h3>Selected Node:</h3>";
        str += "<p>Figure: " + shape.figure + "</p>";
        str += "<p>Text: <textarea style='height:100px;' id='nodetext'> " + txtblock.text + "</textarea></p>";
        var strokeColor = shape.stroke;
        str += '<p style="float: left; margin-right: 10px;">Color: <input type="text" id="custom" /></p>';
        info.innerHTML = str;


        $(document).on('keyup','#nodetext',function(a)
        {
            a.preventDefault();
            txtblock.text=$(this).val() ;

        })
        // Initialize color picker
        $("#custom").spectrum({
            color: strokeColor,

            // Change colors by constructing a gradient
            change: function(color) {
                var c = color.toRgb();
                var r, g, b;
                var grad1 = new go.Brush(go.Brush.Linear);
                r = Math.min(c.r + 10, 255);
                g = Math.min(c.g + 10, 255);
                b = Math.min(c.b + 10, 255);
                grad1.addColorStop(0, "rgb(" + r + "," + g + "," + b + ")");
                grad1.addColorStop(0.5, color.toRgbString());
                r = Math.max(c.r - 30, 0);
                g = Math.max(c.g - 30, 0);
                b = Math.max(c.b - 30, 0);
                grad1.addColorStop(1, "rgb(" + r + "," + g + "," + b + ")");
                shape.fill = grad1;
                shape.stroke = "rgb(" + r + "," + g + "," + b + ")";
                txtblock.stroke = (r < 100 && g < 100 && b < 100) ? "white" : "black";
            }
        });

    }); 

var info=document.getElementById（“myInfo”）；
myDiagram.addDiagramListener（“ChangedSelection”），函数（e1）{
var sel=e1.图表选择；
var str=“”；
如果（sel.count==0）{
str=“在主关系图中选择节点将在此处显示信息。”；
info.innerHTML=str；
返回；
}否则，如果（选择计数>1）{
str=sel.count+“选定对象。”；
info.innerHTML=str；
返回；
}
//选择一个对象，显示一些信息
var elem=sel.first（）；
变量形状=元素findObject（“形状”）；
var txtblock=elem.findObject（“文本”）；
str+=“所选节点：”；
str+=“图：“+shape.Figure+”
”；
str+=”Text:“+txtblock.Text+”
”；
var strokeColor=shape.stroke；
str+='
；
info.innerHTML=str；
$（文档）.on（'keyup'，'#nodetext'，函数（a）
{
a、 预防默认值（）；
text=$（this.val（）；
})
//初始化颜色选择器
$（“#定制”）.频谱({
颜色：strokeColor，
//通过构造渐变来改变颜色
更改：功能（颜色）{
var c=color.toRgb（）；
var r，g，b；
var grad1=新的go.Brush（go.Brush.Linear）；
r=数学最小值（c.r+10255）；
g=数学最小值（c.g+10255）；
b=数学最小值（c.b+10255）；
渐变1.添加颜色停止（0，“rgb（“+r+”，“+g+”，“+b+”））；
grad1.addColorStop（0.5，color.toRgbString（））；
r=数学最大值（c.r-30，0）；
g=数学最大值（c.g-30，0）；
b=数学最大值（c.b-30，0）；
渐变1.添加颜色停止（1，“rgb（“+r+”，“+g+”，“+b+”））；
shape.fill=grad1；
shape.stroke=“rgb（“+r+”，“+g+”，“+b+”）；
txtblock.stroke=（r<100&&g<100&&b<100）？“白色”：“黑色”；
}
});
}); 

要清楚，您的问题是关于修改形状和TextBlock的颜色，而不是试图修改TextBlock.text属性

问题在于，每次Diagram.selection集合更改时，您都在为Spectrum对象添加一个“更改”事件处理程序。该事件处理程序是一个闭包，其中包含对特定选定节点的引用。随着选择的更改，您将添加一个新的事件处理程序，但旧的事件处理程序仍然存在并被调用，从而修改以前选择的节点

有几种可能的解决办法。我建议您只定义一次Spectrum的更改事件处理程序，而不是在“ChangedSelection”DiagrameEvent侦听器中。将其设置为在图中所有选定节点上运行的函数，而不是在特定节点上运行的函数。或者，如果只选择了一个节点，则可能会更改颜色，这是您想要的策略

---

顺便说一下，除非您的链接不可选择，否则当用户选择链接时，您的代码应该处理这种情况。

要清楚，您的问题是关于修改形状和TextBlock的颜色，而不是试图修改TextBlock.text属性

问题在于，每次Diagram.selection集合更改时，您都在为Spectrum对象添加一个“更改”事件处理程序。该事件处理程序是一个闭包，其中包含对特定选定节点的引用。随着选择的更改，您将添加一个新的事件处理程序，但旧的事件处理程序仍然存在并被调用，从而修改以前选择的节点

有几种可能的解决办法。我建议您只定义一次Spectrum的更改事件处理程序，而不是在“ChangedSelection”DiagrameEvent侦听器中。将其设置为在图中所有选定节点上运行的函数，而不是在特定节点上运行的函数。或者，如果只选择了一个节点，则可能会更改颜色，这是您想要的策略

顺便说一下，除非您的链接不可选择，否则您的代码应该处理用户选择链接时的情况