javascript - 如何在 MVC4 中准确捕捉 x 和 y 位置并重新定位？

Question

可能重复：
动态检索 HTML 元素的位置 (X,Y)

在 MVC4 应用程序（针对 IE7+）中，我有一张图片。我希望用户能够单击图像以定位一个小标记（图像），并且我想存储与图像相关的相对 x/y 位置，以便当用户返回此页面时我可以重新定位此图钉再次。

实现这一目标的最佳方法是什么？

Answer 1

您可以使用<input type="image" />标签 - 这就像<input type="submit" />但它将点击的 x 和 y 坐标发布回服务器。

看法

<h1>Click on the image to place a pin</h1>
@using(Html.BeginForm())
{
    <input type="image" name="coords" src="http://placehold.it/300x300" />
}

控制器

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View();
    }

    [HttpPost]
    public ActionResult Index(FormCollection form)
    {
        int x = int.Parse(form["coords.x"]);
        int y = int.Parse(form["coords.y"]);

        // FIXME Save location of pin

        return View();
    }

}