2016年10月21日 星期五

[研究][C#][ASP.NET] 取得 Panel 上滑鼠移動座標和 Click 座標

[研究][C#][ASP.NET] 取得 Panel 上滑鼠移動座標和 Click 座標

2016-10-21

使用 Visual Studio 2015 with Update 3 + IE11

GetMousePosition.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="GetMousePosition.aspx.cs" Inherits="WebApplication4.GetMousePosition" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
<%--            <input id="hidX" name="hidX" type="hidden" />
            <input id="hidY" name="hidY" type="hidden" />--%>
            <asp:Panel ID="Panel1" runat="server" Width="600px" Height="400px" BorderStyle="Solid">
                Panel
            </asp:Panel>
            <p>X:<input name="xPos" type="text" size="5" /></p>
            <p>Y:<input name="yPos" type="text" size="5" /></p>
            <asp:Label ID="Label1" runat="server"></asp:Label>
        </div>
    </form>
    <script language="JavaScript">
<!--
    function getPanelMouseCoOrds() {
        var mouseX = event.clientX + document.body.scrollLeft;
        var mouseY = event.clientY + document.body.scrollTop;

        form1.xPos.value = mouseX;
        form1.yPos.value = mouseY;

        return true;
    }

    function handlePanelClick() {
        form1.submit();
    }
    // -->
    </script>
</body>
</html>



GetMousePosition.aspx.cs

using System;
using System.Web.UI;

namespace WebApplication4
{
    public partial class GetMousePosition : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!Page.IsPostBack)
            {
                Panel1.Attributes["onmousemove"] = "getPanelMouseCoOrds()";
                Panel1.Attributes["onclick"] = "handlePanelClick()";
            }
            else
            {
                int panelX = Int32.Parse(Request.Form["xPos"]);
                int panelY = Int32.Parse(Request.Form["yPos"]);

                Label1.Text = "Mouse is clicked on (" + panelX + ", " + panelY + ")";
            }
        }
    }
}

    

(完)

沒有留言:

張貼留言