我目前正在开发一个离线应用程序,我使用Interactive svg。我的问题是在单击事件上删除 svg 行的最后一个节点。情况是...它的工作原理是(第一次单击),它会删除最后一个节点。但是当我再次尝试时..(第二次单击)它不再起作用了。我似乎找不到问题所在。
这是我创建 svg 线段的代码..
var glblLineNode;
var tempX=[], tempY=[], tempLine=[];
function drawRoad()
{
var path = glblGeogSorc.getElementsByTagName("path")
for (var loop=0; loop<Slct.length; loop++)
{
path[loop].addEventListener("mousedown", function(e)
{
if(e.button == 0 && glblenblroad === true)
{
var mousex = e.clientX - matrixE;
var mousey = e.clientY - matrixF;
tempX.push(mousex), tempY.push(mousey);
if(tempX.length > 1)
{
var road = document.createElementNS("http://www.w3.org/2000/svg", "line");
road.x1.baseVal.value = tempX[tempX.length -1];
road.y1.baseVal.value = tempY[tempY.length -1];
road.x2.baseVal.value = tempX[tempX.length -2];
road.y2.baseVal.value = tempY[tempY.length -2];
road.setAttributeNS(null, "stroke", "#686968");
road.setAttributeNS(null, "stroke-width", "14.520");
road.setAttributeNS(null, "stroke-linecap", "round");
road.setAttributeNS(null, "fill", "none");
glblGeogSorc.getElementsByTagName("g")[0].appendChild(road);
tempLine.push(road);
glblLineNode = road;
}
}
},false);
}
}
我们假设函数drawRoad()已被执行, 然后这是我从函数drawRoad()中删除创建的svg线的最后一个节点的代码
delLastNode.addEventListener("click", function() // delLastNode is a var for my button
{
glblGeogSorc.parentNode.removeChild(glblLineNode); //glblLineNode is global var prior to the line created
tempLine.pop(); //as well as tempLine[]
tempX.pop();
tempY.pop();
},false);
它适用于第一次单击 delLastNode(Button) 但当尝试再次单击它时 它不再工作了..我的目标是每次我想单击 delLastNode(Button) 时删除每个新的最后一个节点。
最佳答案
glblLineNode
在每个循环上都会被覆盖,因此它只保存对最后一个变量的引用(因为循环结束)。当您删除该元素时,该引用就会被破坏,这就是它只能工作一次的原因。
你的函数应该是这样的:
delLastNode.addEventListener("click", function() // delLastNode is a var for my button
{
// .pop() returns the removed element, so let's store it.
var deleteElem = tempLine.pop();
glblGeogSorc.parentNode.removeChild(deleteElem);
tempX.pop();
tempY.pop();
},false);
不需要全局变量。
关于javascript - 在 javascript 中每次点击时删除 svg 行新的最后一个节点,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12339039/