将变量从 foreach 循环传递到上下文菜单

Question

注意：我不是在问如何修复我的代码，因为我还没有编写大部分代码。我在问我将如何做我在下面描述的事情（即将 foreach 循环生成的超链接附加到上下文项，而不仅仅是用户名）。或者我想更清晰的表述方式是我希望上下文菜单知道用户正在右键单击哪个用户。

你好，基本上我想做的是我有一个用户列表，在我的网页上我想打印一个用户名列表，当右键单击时，会弹出一个上下文菜单，其中包含以下选项"send friend request," 或 "Message user," 并且当用户单击这些选项之一时，比方说 "Message user" 选项，用户将被发送到另一个页面，并在 URL 作为查询字符串。

这是我目前所拥有的：生成超链接列表的代码片段，当点击这些超链接时，会将用户发送到下一页，并在 URL

<ul>
 <%foreach(UserCredential u in Global.Users) %>
 <%{ %>
  <li><a href="<%= "Chat.aspx?RecID=" + u.UserID.ToString() %>"><%= u.Name %></a></li>
 <%} %>
<ul />

这是上下文菜单的代码

<div style="display:none; "   id="contextMenu">
        <table  border="0" cellpadding="0" cellspacing="0" 

            style="border: thin solid #808080; cursor: default;" width="100px" 

            bgcolor="White">
            <tr>
                <td >
                    <div  class="ContextItem">Message User</div>
                </td>
            </tr>
            <tr>
                <td >
                <div  class="ContextItem">Friend User</div>
                </td>
            </tr>
            <tr>
                <td >
                    <div  class="ContextItem">Delete</div>
                </td>
            </tr>
        </table>
 </div>

基本上我想将 "a href="<%= "Chat.aspx?RecID=" + u.UserID.ToString() %>"" 从循环移动到用户单击 ContextItem 的位置。

这是我现在拥有的：

function ShowMenu(control, e, id) {
        var posx = e.clientX + window.pageXOffset + 'px'; //Left Position of Mouse Pointer
        var posy = e.clientY + window.pageYOffset + 'px'; //Top Position of Mouse Pointer
        document.getElementById(control).style.position = 'absolute';
        document.getElementById(control).style.display = 'inline';
        document.getElementById(control).style.left = posx;
        document.getElementById(control).style.top = posy;

        a.style.position = 'absolute';
        a.style.display = 'inline';
        a.style.left = posx;
        a.style.top = posy;
        var jqContext = '#' + id;

        var view = document.getElementById("viewId");
        view.href = "Chat.aspx?RecID=" + id;
    }

这是我的 foreach 循环：

<%foreach(UserCredential u in Global.Users) %>
        <%{ %>
            <li onmousedown="HideMenu('contextMenu');" onmouseup="HideMenu('contextMenu');" oncontextmenu="ShowMenu('contextMenu', event, <%= u.UserID.ToString() %>);"><%= u.Name %></li>
        <%} %>

这是我的全部代码。如果有人能弄清楚它有什么问题，请告诉我。

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="ProfilePicTest.aspx.cs" Inherits="ProfilePicTest" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
 <script language="javascript" type="text/javascript">

  function ShowMenu(control, e, id) {
   var posx = e.clientX + window.pageXOffset + 'px'; //Left Position of Mouse Pointer
   var posy = e.clientY + window.pageYOffset + 'px'; //Top Position of Mouse Pointer
   document.getElementById(control).style.position = 'absolute';
   document.getElementById(control).style.display = 'inline';
   document.getElementById(control).style.left = posx;
   document.getElementById(control).style.top = posy;

   a.style.position = 'absolute';
   a.style.display = 'inline';
   a.style.left = posx;
   a.style.top = posy;
   var jqContext = '#' + id;

   var view = document.getElementById("viewId");
   view.href = "Chat.aspx?RecID=" + id;
  }
  function HideMenu(control) {

   document.getElementById(control).style.display = 'none';
  }
       
 </script>
</head>
<body onclick="HideMenu('contextMenu');" oncontextmenu="return false">
    <form id="form1" runat="server">
    <div>
  <ul>
   <%foreach(UserCredential u in Global.Users) %>
   <%{ %>
    <li onmousedown="HideMenu('contextMenu');" onmouseup="HideMenu('contextMenu');" oncontextmenu="ShowMenu('contextMenu', event, 3);"><%= u.Name %></li>
   <%} %>
  </ul>
    </div>


  <br />
    <br />
    <div style="display:none; "   id="contextMenu">
        <table  border="0" cellpadding="0" cellspacing="0" 
            style="border: thin solid #808080; cursor: default;" width="100px" 
            bgcolor="White">
            <tr>
                <td >
                    <a href="#" id="viewId">Send a Friend Request</a>
                    </td>
            </tr>
            <tr>
                <td >
                  <a href="#"  id="editId">Message</a>
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

后台代码为空：

Answer 1

如果这符合您的期望，请告诉我

function ShowMenu(control, e, id) {
            var posx = e.clientX + 'px';
            var posy = e.clientY + 'px';
   var a = document.getElementById(control); 
   
            a.style.position = 'absolute';
            a.style.display = 'inline';
            a.style.left = posx;
            a.style.top = posy;
            var jqContext = '#' + control;
            
   var view = document.getElementById("viewId"); 
   view.href = "http://www.google.com/search?q=" + id; //Construct your URL based on parameter
   
        }
        function HideMenu(control) {
            document.getElementById(control).style.display = 'none';
        }

.ContextItem
        {
            background-color:White;
            color:Black;
            font-weight:normal;
            
            }
        .ContextItem:hover
        {
            background-color:#0066FF;
            color:White;
            font-weight:bold;
            
        }
       .detailItem
       {
           background:transparant;
           
       }
       .detailItem:hover
       {
           background-color:#FEE378;
           border: 1px outset #222222;
           font-weight:bold;
           cursor:default;
       }

<body onclick="HideMenu('contextMenu');" oncontextmenu="return false">
    <div  onmousedown="HideMenu('contextMenu');"
          onmouseup="HideMenu('contextMenu');"
        oncontextmenu="ShowMenu('contextMenu',event,1);"
         class="detailItem">
    User 1
        </div>
         <div  onmousedown="HideMenu('contextMenu');"
          onmouseup="HideMenu('contextMenu');"
        oncontextmenu="ShowMenu('contextMenu',event,2);"
         class="detailItem">
     User 2
        </div>
       <div  onmousedown="HideMenu('contextMenu');"
          onmouseup="HideMenu('contextMenu');"
        oncontextmenu="ShowMenu('contextMenu',event,3);"
         class="detailItem">
    User 3
        </div>
    <br />
    <br />
    <div style="display:none; "   id="contextMenu">
        <table  border="0" cellpadding="0" cellspacing="0" 
            style="border: thin solid #808080; cursor: default;" width="100px" 
            bgcolor="White">
            <tr>
                <td >
                    <a href="#" id="viewId"> View</a>
                    </td>
            </tr>
            <tr>
                <td >
                  <a href="#"  id="editId">Edit</a>
                </td>
            </tr>
        </table>
    </div>
</body>

将变量从 foreach 循环传递到上下文菜单

Passing variable from foreach loop into context menu

c#

asp.net

contextmenu