vb.net中对mouseUp事件的疑惑

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vb.net中对mouseUp事件的疑惑相关的知识,希望对你有一定的参考价值。

我的开发环境是vs2010,Panel里有一个按钮Button,如果在Button外面按下鼠标,移动到按钮上,再松开鼠标,那么按照MouseUp事件的定义,应该是触发按钮的MouseUp事件,可经过跟踪,我发现此时触发的事件居然是Panel的MouseUp,为什么呢?难道鼠标的一次点击,对应的mouseDown和mouseUp事件只能针对一个控件吗?

你的按钮没以mousedown哪来的mouseup??

你应该是如果在Button外面按下鼠标,移动到按钮上并执行mousedown,然后就才会有按钮的mouseup追问

那么下面的设计需求怎么实现:

让鼠标在第一个大王出按钮,移动到小王的位置,松开鼠标;我本想通过mouseDown事件找到大王,mouseUp事件找到第三张小王,可实际情况却不如所愿,我该怎么实现这个功能呢?

追答

考虑mousemove

追问

当鼠标在第一个大王上按下后,再移动到其他扑克上,是不会触发mouseMove事件的,而在其他扑克上松开鼠标,触发的mouseUp事件也是针对第一个大王的!
实在没找到好的办法,就只有采用根据鼠标位置来实现这个功能了!

参考技术A 在鼠标按下时,已经记忆鼠标所在的控件了,

在mouseup事件处理程序中取消单击事件

编写一些拖放代码,我想在我的mouseup处理程序中取消单击事件。我认为防止默认应该做的伎俩,但点击事件仍然被触发。

有没有办法做到这一点?


这不起作用:

<div id="test">test</div>
<script>
$("#test").mouseup (function (e) {
  var a = 1;
  e.preventDefault();
});
$("#test").click (function (e) {
  var a = 2;
});
答案

我有同样的问题,也没有找到解决方案。但我想出了一个似乎有用的黑客。

由于onMouseUp处理程序似乎无法取消对具有preventDefault或stopEvent或其他任何内容的链接的单击,因此我们需要使链接自行取消。这可以通过编写onclick属性来完成,该属性在拖动开始时向a-tag返回false,并在拖动结束时将其删除。

并且由于onDragEnd或onMouseUp处理程序在浏览器解释单击之前运行,我们需要检查拖动结束的位置以及单击哪个链接等等。如果它在拖动链接之外结束(我们拖动链接以便光标不再在链接上),我们删除onDragEnd中的onclick处理程序;但如果它在光标在拖动链接上的位置结束(将启动一次点击),我们让onclick-handler自行删除。很复杂,对吗?

不完整的代码,但只是为了向您展示这个想法:

// event handler that runs when the drag is initiated
function onDragStart (args) {
  // get the dragged element
  // do some checking if it's a link etc
  // store it in global var or smth

  // write the onclick handler to link element
  linkElement.writeAttribute('onclick', 'removeClickHandler(this); return false;');
}

// run from the onclick handler in the a-tag when the onMouseUp occurs on the link
function removeClickHandler (element) {
  // remove click handler from self
  element.writeAttribute('onclick', null);
}

// event handler that runs when the drag ends
function onDragEnds (args) {
  // get the target element

  // check that it's not the a-tag which we're dragging,
  // since we want the onclick handler to take care of that case
  if (targetElement !== linkElement) {
    // remove the onclick handler
    linkElement.writeAttribute('onclick', null);
  }
}

我希望这能让你了解如何实现这一目标。正如我所说,这不是一个完整的解决方案,只是解释了这个概念。

另一答案

我使用的解决方案如下:

var disable_click = false;

function click_function(event){
    if (!disable_click){
        // your code
    }
}

function mouse_down_function(event){
    disable_click = false; // will enable the click everytime you click
    // your code
}

function mouse_up_function(event){
    // your code
}

function mouse_drag_function(event){
    disable_click = true; // this will disable the click only when dragging after clicking
   // your code
}

根据名称将每个功能附加到相应的事件!

另一答案

我的解决方案不需要全局变量或超时或更改html元素只是jquery肯定在普通js中有一些兼容性。

我为onClick声明了一个函数

function onMouseClick(event){
     // do sth
}

我为MouseDown声明了一个函数(你也可以在鼠标中执行相同操作)来决定是否处理onclick事件

function onMouseDown(event){
     // some code to decide if I want a click to occur after mouseup or not
    if(myDecision){
        $('#domElement').on("click", onMouseClick);
    }
    else $('#domElement').off("click");
} 

快速注意:你应该确保 $('#domElement').on("click", onMouseClick);未执行多次。在我看来,如果它是onMouseClick也将被多次调用。

另一答案
$(document).mouseup(function(event){

    event.preventDefault(); // this prevents only a default action but previously assigned listeners will be called
    event.stopImmediatePropagation() // if there are  others listeners which that shouldn't call 
}
另一答案
$(document).mouseup(function(event){ // make sure to set the event parameter
    event.preventDefault(); // prevent default, like you said
});

需要注意的重要事项是event参数。

编辑:你想取消阻力?

我知道这样做的方法是使用bind()(对于较旧的jQuery版本)或on()(对于jQuery 1.7+)来附加mousedown事件,然后分别使用unbind()off()来分离它。

$(document)
    .on("mousedown", function(){...})
    .on("mouseup", function(){
        $(document).off("mousedown");
    });
另一答案

如果您希望禁止click事件,则只在click事件处理程序中添加语句event.preventDefault(),而不是mouseup事件处理程序。使用以下代码,您将获得它的工作。

<div id="test">test</div>
<script>
$("#test").mouseup (function (e) {
  var a = 1;

});
$("#test").click (function (e) {
 e.preventDefault();
  var a = 2;
});

希望这能解决你的问题。

另一答案

使用事件捕获阶段

在要取消click事件的元素周围放置一个元素,并为其添加捕获事件处理程序。

var btnElm = document.querySelector('button');

btnElm.addEventListener('mouseup', function(e){
    console.log('mouseup');
    
    window.addEventListener(
        'click',
        captureClick,
        true // <-- This registeres this listener for the capture
             //     phase instead of the bubbling phase!
    ); 
});

btnElm.addEventListener('click', function(e){
    console.log('click');
});

function captureClick(e) {
    e.stopPropagation(); // Stop the click from being propagated.
    console.log('click captured');
    window.removeEventListener('click', captureClick, true); // cleanup
}
<button>Test capture click event</button>
另一答案

有一个解决方案!

这种方法对我很有用(至少在chrome中):

mousedown上我向当前被移动的元素添加了一个类,在mouseup上我删除了该类。

所有课程都是设置pointer-events:none

不知何故,这使它工作,并没有触发点击事件。

另一答案

问题是有一个元素。它需要响应点击。它也需要被拖动。但是,当它被拖动时,它不需要在被删除时触发点击。

有点晚了,但也许它会帮助别人。创建一个名为“noclick”的全局变量,并将其设置为false。拖动项目时,将noclick设置为true。在你的点击处理程序中,如果noclick为true,则将其设置为false,然后使用preventDefault,return false,stopPropagation等。但这不适用于Chrome,因为Chrome已经具有所需的行为。只需将其设置为只有浏览器不是Chrome时,拖动功能才会将noclick设置为true。

您的点击处理程序仍然会被触发,但至少它有一种方法可以知道它刚刚从拖动中返回并相应地表现。

另一答案

对我的情况最好的解决方案是:

el.addEventListener('mousedown', (event) => {
  clickTime = new Date()
})

el.addEventListener('click', (event) => {
  if (new Date() - clickTime < 150) {
    // do something
  }
})

这为用户提供了150ms的释放时间,如果超过150ms则被认为是暂停,而不是点击

另一答案

由于它们是不同的事件,你不能从onclick取消onmouseup,如果你打电话给preventDefaultcancelBubble,或者其他什么,你正在阻止onmouseup事件被进一步处理。 onclick事件仍然悬而未决,但可以说是被解雇了。

你需要的是你自己的布尔标志,例如isDragging。您可以在拖动开始时将此设置为true(例如,在onmousedown内,或其他任何内容)。

但是如果你直接从onmouseup将其重置为假,当你收到你的onclick事件(isDragging == false)时,你将不再拖动,因为onmouseuponclick之前发射。

所以你需要做的是使用一个短暂的超时(例如setTimeout(function() {isDragging = false;}, 50);),所以当你的onclick事件被触发时,isDragging仍然是true,你的onclick事件处理程序可以在它做任何其他事情之前简单地拥有if(isDragging) return false;

另一答案

它可能是可能的,但我不确定你是否可以使用jQuery处理这种evt管理。 This code example不应该远离你的期望或至少给你一个方向。

function AddEvent(id, evt_type, ma_fonction, phase) {
    var oElt = document.getElementById(id);
    // modèle W3C mode bubbling
    if( oElt.addEventListener ) {
        oElt.addEventListener(evt_type, ma_fonction, phase);
    // modèle MSIE
    } else if( oElt.attachEvent ) {
        oElt.attachEvent('on'+evt_type, ma_fonction);
    }
    return false;
}

function DelEvent(id, evt_type, ma_fonction, phase) {
    var oElt = document.getElementById(id);
    // modèle W3C mode bubbling
    if( oElt.removeEventListener ) {
        oElt.removeEventListener(evt_type, ma_fonction, phase);
    // modèle MSIE
    } else if( oElt.detachEvent ) {
        oElt.detachEvent('on'+evt_type, ma_fonction);
    }
    return false;
}

    var mon_id = 'test';
    var le_type_evt = "mouseup";
    var flux_evt = false; // prevent bubbling
    var action_du_gestionnaire = function(e) {
        alert('evt mouseup on tag <div>');

        // 1ère méthode : DOM Lev 2
        // W3C
            if ( e.target )
                e.target.removeEventListener(le_type_evt, arguments.callee, fl

以上是关于vb.net中对mouseUp事件的疑惑的主要内容,如果未能解决你的问题,请参考以下文章

使用VB在ASP.Net中对GridView中的事件进行排序

如何在 vb.net 中对数据进行多次搜索

无法将对象类型“System.String[*]”转换为“System.String[]”

在 VS2010 express 中对 vb.net 进行单元测试

C# mouseUp事件

将“dragstart”事件附加到“mouseup”以获得可拖动体验