Question

使用javascript我想点击链接，然后让javascript将图像元素移动到某个位置。唯一面临的问题是图像元素不会停留在那里，为什么是

示例javascript：

function move( e )
{  
    var clickedLink = e.target;    
    // getting location of clicked link.
    clickedLink.style.left = "200px";
    clickedLink.style.top = "200px";
}

上面函数中的“clickedLink”元素对象的css。

#clickedLink 
{
  left: 0px;  
  position: relative;
  top: -500px;
  z-index: 10;   
}

Answer 1

目标没有样式选项只需更改为e。

 function move( e )
{  
    var clickedLink = e.target;    
    // getting location of clicked link.
    e.style.top = "200px";
    e.style.left = "200px";

}

Answer 2

当你说它不会“留在那里”时，你不会试图让它在页面刷新之后留在那里而不是在某处保存它的新位置，是吗？

更新：要存储位置，这取决于您存储它的原因。您可以像其他人建议的那样将其存储在cookie中，但这只会在该浏览器中为该用户保存，并且只有在他们清除cookie之后才会存储。

如果您希望在不同浏览器中进行更改，或者将其提供给其他用户...那么您需要通过Ajax将更改保留到服务器，并且您必须在位置设置等中加载服务器端代码

Answer 3

使用Javascript所做的更改不会在页面重新加载时保留。

必须使用CSS进行永久性更改，否则每次加载页面时都必须使用Javascript重新移动元素。

例如，您可以将客户端的首选项保存在cookie中，然后使用window.onload事件触发检查cookie的函数，并相应地更新元素。

或者，您可以使用服务器端脚本生成一个额外的CSS文件，以便在保存时自定义以适应当前用户的首选项（假设它是同一个用户）。然后，在加载页面时检查此文件是否存在（再次使用服务器端脚本）。

重点是，Javascript更改只是暂时的，因为它们在客户端的浏览器上发生过一次。

Answer 4

如果您希望在页面刷新后将其保留在原位，则需要将其位置存储在Cookie中并在页面加载时加载它。

如何使用javascript移动图像元素以及如何使其保持在那里

4 个答案: