经过在Chrome、IE和Firefox上测试，发现在按钮上按下鼠标，拖动到按钮外松开，可以触发mousedown事件，但无法触发mouseup和click事件。在这种情况下，如果想触发按钮的mouseup和click事件，应该怎么做呢？
解决方法：
定义一个JS变量，表示按钮是否按下，初始化为false。在按钮mousedown事件的响应函数里，将这个变量置为true。然后监听整个页面的mouseup事件，在响应函数里，判断变量是否为true；如果不是true，啥都不做；如果是true，说明之前刚刚按下了按钮，就调用按钮的mouseup或click响应函数，同时将变量置为false。
也可以用hidden元素(<input type="hidden">)或按钮的隐藏属性来记录按钮的状态。
一个例子：
<!DOCTYPE html>
<html>
<head>
<title>buttonTest.html</title>
<meta name="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="../js/jquery-1.7.2.js"></script>
</head>
<body>
<br>
<br>
<button type="button" id="button1" _status="up">Click</button>
<div id="infoDiv"></div>
<script type="text/javascript">
$(document).ready(function(){
$("#button1").mousedown(function(){
$(this).attr("_status", "down");
$("#infoDiv").append("<div>Mouse down</div>");
});
$("body").mouseup(function(){ // 也可以用$(document).mouseup
if ($("#button1").attr("_status")=="down") {
$("#button1").attr("_status", "up");
$("#infoDiv").append("<div>Mouse up</div>");
}
});
$("#button1").click(function(){
$("#infoDiv").append("<div>Mouse clicked</div>");
});
});
</script>
</body>
</html>
相关推荐
ASP.NET页面按钮点击，不能触发C_中的CLICK事件，文档很安全。
在运行时单击屏幕生成按钮，并编写按钮的click事件，不是在设计时生成。
在页面加载完成时候 ‘.add_project’ 元素是可以触发click时间的，当动态添加 ‘.add_project’ 时候，新添加的元素却触发不了click事件，类似下面的写法： $(".add_project").on('click', function(){ alert(...
解决WPF中button按钮同时点击多次触发click的方法，供大家参考，具体内容如下 DateTime lastClick = DateTime.Now; object obj = new object(); int i = 0; private void Button_Click(object sender, ...
Q713454 winform panel click事件 子控件一起触发 https://ask.csdn.net/questions/713454
为了能够触发C# Button的双击事件，我们可以重载MouseDown事件，记录每次鼠标按下的时间，如果 两次点击的时间足够近的话，就触发一次双击方法。 这样也大致能够达到双击的效果，我所采用的方法其实和这个类似，...
鼠标上下方向拖拽，如果松开时鼠标位于悬浮按钮上会默认执行click事件，经验证，click事件与mouse事件的执行顺序为onmousedown =》onmouseup =》onclick,意味着在click事件执行时会与与其相关的mouse事件冲突。...
情况描述 当某个元素，如：div，同时绑定了click事件和dblclick事件，而这两个事件又要处理相对独立的业务，也就是click的时候不能触发dblclick，dblclick的时候不能触发click。在实际测试中发现，当dblclick的时候...
使用customRow 设置行属性，写对应事件 :customRow=”rowClick” 然后在data里面写 rowClick: record => ({ // 事件 on: { click: () => { // 点击改行时要做的事情 // ...... console.log(record, 'record...
在C#的WebBrowse控件中捕获 MouseClick 或 MouseDown事件的方法。
要做一个博客，我使用了DoNetTextBox作为在线编辑器，我添加了一个提交按钮，但是运行时，点了按钮并不会转到事件处理代码，而是出现下面的错误： “/CIS”应用程序中的服务器错误。 -----------------------------...
解决Vue对Element中的el-tab-pane添加@click事件无效
鼠标事件即鼠标操作点击图表的图形（如click、dblclick、contextmenu）或hover图表的图形（如mouseover、mouseout、mousemove）时触发的事件。 在ECharts中，用户的任何操作，都可能会触发相应的事件。在ECharts中...
echarts 3D地图，地图区域点击触发事件，3d地图加数据
当鼠标指针在匹配元素上方，然后按下并松开鼠标左键或者调用click()方法都会触发click事件。 一个完整的事件过程，不但要有能够触发事件的条件，而且还要有事件处理程序。 可以通过click()方法为click事件绑定事件...
FireFox与IE 下js兼容触发click事件 ,对于需要兼容这两者的朋友，就需要参考下下面的代码了
VB 6.0单击按钮移动鼠标到指定位置，如示例图所示的效果，单击按钮后，将鼠标移动在屏幕的左上角。 Private Sub Command1_Click() '移动鼠标 Label1.Caption = "鼠标在屏幕的左上角！" SetCursorPos 0, 0 ...
当鼠标指针在匹配元素上方，然后按下并松开鼠标左键或者调用click()方法都会触发click事件。 click()方法也可以绑定事件处理方法。 语法结构一: 触发click事件。 代码如下:$(selector).click() 语法结构二: 为click...
在asp.net引入事件驱动...用户按回车也不是没有提交表单，通过httpwath可以看到，实际上页面表单是提交到了form下的action页面，只不过没有触发onclick事件而已。 在asp.net事件驱动模式下面，要实现通过回车来触发事