2

我正在使用这个解决方案来隐藏中间 mousclick 上的 div,但现在我需要将它包含在一个没有 jQuery 可用的普通调试脚本中(而且永远不会)。

如何编写该事件并使用纯 JavaScript 绑定?

我正在搜索谷歌和 SO,但只有我得到的工作脚本,所有基于 jQuery 的。


最终代码:

<script type="text/javascript">
    function hideOnMiddle(event) {
        if ('which' in event) {
            if( event.which == 2 ) {
                document.getElementById('test').style.display = 'none'; 
            }
        }
    }
</script>
<div id="test" onmousedown="hideOnMiddle(event);">Hide me with middle mouse button</div>
4

2 回答 2

2

看看这个:http ://help.dottoro.com/ljwcseaq.php (示例 HTML 代码 3)(jsFiddle)

<head>
    <script type="text/javascript">
        function WhichButton (event) {
                // all browsers except IE before version 9
            if ('which' in event) {
                switch (event.which) {
                case 1:
                    alert ("Left button is pressed");
                    break;
                case 2:
                    alert ("Middle button is pressed");
                    break;
                case 3:
                    alert ("Right button is pressed");
                    break;
                }
            }
            else {
                    // Internet Explorer before version 9
                if ('button' in event) {
                    var buttons = "";
                    if (event.button & 1) {
                        buttons += "left";
                    }
                    if (event.button & 2) {
                        if (buttons == "") {
                            buttons += "right";
                        }
                        else {
                            buttons += " + right";
                        }
                    }
                    if (event.button & 4) {
                        if (buttons == "") {
                            buttons += "middle";
                        }
                        else {
                            buttons += " + middle";
                        }
                    }
                    alert ("The following buttons are pressed: " + buttons);
                }
            }
        }
    </script>
</head>
<body>
    <div onmousedown="WhichButton (event);">Press a mouse button over this text!</div>
</body>
于 2013-01-21T09:37:15.283 回答
0

在这种情况下需要做的第一件事是找出它是哪个鼠标单击。为此,我有一段使用 java 脚本的工作代码,您可以使用它。我在这里有的是,我已经用链接测试了鼠标事件,然后是一个文本框和一个提交事件。您可以将以下内容用于您自己的好处:

    <SCRIPT type="text/javascript">
    function captureButton(event)
    {
        var button;
        if (event.which == null)
           button= (event.button < 2) ? "MOUSE BUTTON : LEFT" :
                     ((event.button == 4) ? "MOUSE BUTTON : MIDDLE" : "MOUSE BUTTON : RIGHT");
        else
           button= (event.which < 2) ? "MOUSE BUTTON : LEFT" :
                     ((event.which == 2) ? "MOUSE BUTTON : MIDDLE" : "MOUSE BUTTON : RIGHT");
        alert(button);
        preventOperation(event);
    }
    function preventOperation(event)
    {
        if (event.preventDefault)
            event.preventDefault();
        else
            event.returnValue= false;
         return false;
    }
    </SCRIPT>

    <div><B>Link Testing : </B>
    <A onmouseup="return preventOperation(event)" oncontextmenu="return preventOperation(event)" onmousedown="return captureButton(event)" ondblclick="return preventOperation(event)" onclick="return preventOperation(event)" href="javascript:void(null)">Click here with various mouse buttons to test</A> </div><BR>
    <div>
    <B>Submit Event : </B>
    <INPUT onmouseup="return preventOperation(event)" oncontextmenu="return preventOperation(event)" onmousedown="return captureButton(event)" ondblclick="return preventOperation(event)" onclick="return preventOperation(event)" type=submit value="Submit Query" name=btnG> </div><BR>
    <div>
    <B>Text Box : </B>
    <INPUT onmouseup="return preventOperation(event)" oncontextmenu="return preventOperation(event)" onmousedown="return captureButton(event)" ondblclick="return preventOperation(event)" onclick="return preventOperation(event)" name=btnG>
     </div>

我希望这个可以帮助您解决您的具体问题。

于 2013-01-21T09:35:44.160 回答