Question

我是JavaScript新手，我正在学习，但现在我遇到一个小问题，我不知道如何解决，这是我的代码到目前为止...

<html>
<head>
<title>algo</title>
<script language="javascript" type="text/javascript">

    function ShowMenu(control, e) {
        var posx = e.clientX + 'px';
        var posy = e.clientY + 'px';
        document.getElementById(control).style.position = 'absolute';
        document.getElementById(control).style.display = 'inline';
        document.getElementById(control).style.left = posx;
        document.getElementById(control).style.top = posy;
        var jqContext = '#' + control;
    }

    function HideMenu(control) {

        document.getElementById(control).style.display = 'none';

    }


   </script>
   </head>

<body onclick="HideMenu('contextMenu');" oncontextmenu="return false">
<p onmousedown="HideMenu('contextMenu');"
      onmouseup="HideMenu('contextMenu');"
      oncontextmenu="ShowMenu('contextMenu',event);"
      class="detailItem">
Right Click Here Item: 1
    </p>
     <p onmousedown="HideMenu('contextMenu');"
      onmouseup="HideMenu('contextMenu');"
    oncontextmenu="ShowMenu('contextMenu',event);"
     class="detailItem">
Right Click Here Item: 2
    </p>
   <p onmousedown="HideMenu('contextMenu');"
      onmouseup="HideMenu('contextMenu');"
    oncontextmenu="ShowMenu('contextMenu',event);"
     class="detailItem">
Right Click Here Item: 3
    </p>
<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 >
                <div onclick="javascript:alert('You Clicked '+this.innerHTML);"                                                      onmouseup="ShowMenu('contextMenu','none',event);" class="ContextItem">View</div>
                </td>
        </tr>
        <tr>
            <td >
            <div onclick="javascript:alert('You Clicked '+this.innerHTML);" onmouseup="ShowMenu('contextMenu','none',event);"  class="ContextItem">Restore</div>
            </td>
        </tr>
        <tr>
            <td >
                <div onclick="javascript:alert('You Clicked '+this.innerHTML);" onmouseup="ShowMenu('contextMenu','none',event);"  class="ContextItem">Delete</div>
            </td>
        </tr>
    </table>
    </div>


   </body>
   </html>

，输出是......

Right Click Here Item: 1

Right Click Here Item: 2

Right Click Here Item: 3

到目前为止，代码会停用鼠标右键的默认上下文菜单，当您在一行文本上单击鼠标右键时，它会显示包含，查看，还原和删除的上下文菜单。现在我想要做的是，当我在上下文菜单中点击删除时，它应该删除或隐藏我右键单击的文本行，然后在我点击恢复时重新显示该行。我检查了几个教程，但我不确定如何继续。

删除或隐藏文本

0 个答案: