在窗口外拖动时,Firefox无法正确触发dragleave事件:
https://bugzilla.mozilla.org/show_bug.cgi?id=665704
https://bugzilla.mozilla.org/show_bug.cgi?id=656164
我正在尝试为此开发一种解决方法(我知道这可能是因为Gmail正在这样做),但我能想出的唯一的东西似乎真的很乱.
知道何时拖出窗外的一种方法是等待dragover事件停止发射(因为dragover在拖放操作期间不断发射).这就是我这样做的方式:
var timeout;
function dragleaveFunctionality() {
// do stuff
}
function firefoxTimeoutHack() {
clearTimeout(timeout);
timeout = setTimeout(dragleaveFunctionality, 200);
}
$(document).on('dragover', firefoxTimeoutHack);
此代码实际上是一次又一次地创建和清除超时.除非dragover事件停止触发,否则将无法达到200毫秒的超时.
虽然这有效,但我不喜欢为此目的使用超时的想法.感觉不对.这也意味着在"掉落区"造型消失之前会有一点滞后.
我的另一个想法是检测鼠标何时离开窗口,但在拖放操作期间,这样做的正常方法似乎不起作用.
有没有人有更好的方法这样做？
更新:
这是我正在使用的代码:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Drag and Drop Issue</title>
<script src="http://code.jquery.com/jquery.js"></script>
</head>
<body>
Open up the console and look at what number is reporting when dragging files in and out of the window. The number should always be 0 when leaving …我想在鼠标离开浏览器窗口时运行一些Javascript代码.我只需要支持Safari(WebKit.)
我尝试在窗口上放置一个mouseout处理程序.当鼠标离开浏览器窗口时,可以可靠地调用该处理程序.但是由于冒泡,当鼠标在文档中的元素之间移动时也会调用它.我无法弄清楚如何确定鼠标何时实际离开窗口以及何时仅在元素之间移动.
当鼠标离开窗口时,只生成一个事件,并且目标元素看起来是鼠标实际上的元素.因此,检查目标元素是窗口还是文档是不起作用的.并且将整个页面包装在一个不可见的包含div中也不起作用:如果div是不可见的,那么鼠标永远不会超过它,所以没有任何变化.
(如果我把处理程序放在document或document.body上会发生同样的事情,除了令人惊讶的document.body在鼠标进入或离开窗口的空白部分时没有鼠标悬停/鼠标输出事件,例如创建空的垂直空间通过绝对定位底部元素:0.对于该空间,文档和窗口将获得mouseover/mouseout事件,目标为<html>,但document.body不会.)
我有一些想法:
我们使用prototype.js,所以理想情况下我想用原型的Event.observe来表达解决方案,但我可以想出那部分.
谢谢你的任何建议!
我需要一种方法来检查并查看鼠标是否在浏览器窗口之外.问题是当鼠标RAPIDLY移动到浏览器窗口之外时(我的元素靠近边缘),不会触发mouseout事件(或mousemove).我认为解决我的问题的最好方法是检查一个计时器,如果鼠标在窗口内,或者我没有找到一种方法,因为我需要一个事件来触发以获得鼠标坐标.
我是一个javascript/jquery新手,但似乎应该有办法做到这一点但我到目前为止肯定无法找到它.也许我可以强制鼠标事件触发并查看是否有任何xy值？知道我怎么能这样做吗？
提前致谢!
我想检测鼠标何时离开顶部的视口（可以说是向北）。我在网上搜索并提出了如何检测鼠标何时离开窗口？. 这是一个好的开始，但它也会检测鼠标何时离开其他方向。我怎么能只检测到顶部的出口？
谢谢！
问题没有得到答案(如果你能提供有效的代码,而不是谷歌搜索我的问题,并链接到甜蜜的互联网点上的任何答案,那么我会接受它作为答案.但是因为我已经去过所有人这些问题不会假装它们有效,除非你能提供你测试的实际代码)
如果你这样做
$(window).on("mouseout", function() { alert("OUT"); });
您可以在窗口的左侧或右侧进行鼠标移除,但不会触发事件.我在这里做了一个jsfiddle 但它实际上工作正常,因为iframe周围有一个边框.
那么知道鼠标是否离开窗户的最佳方法是什么？我可以在页面周围放一个1px边框(由4个div组成).我可以监视x/y并判断鼠标是否在边缘.但理想情况下,$(window).on("mouseout",foo)会告诉我鼠标何时离开窗口.
我正在努力创建自己的成绩单,作为AJAX.在它的基础上有一个可编辑单元格的表格.用户点击单元格以输入成绩,当他们点击单元格时,成绩将通过AJAX发送到DB.到目前为止它工作得很好,除了我添加了用户点击Enter的能力,并让它表现得好像用户点击其他地方关闭编辑表单.
问题是,当用户点击返回而不是输入时,模糊部分会运行两次,如警报弹出两次所示.如果他们只是点击某处,那很好.我对jQuery的.blur()的理解是,如果你在没有回调或参数的情况下调用它,它就会充当一个行动者并将其视为所选元素失去焦点.
发生在IE8,Chrome和FF 4.0.1上.在我的测试站点上运行的实时版本
当我尝试设置用户点击输入时的模糊时,有人可以解释为什么它会运行两次吗？
更新:无法发布HTML,因为它实际上只是一个表,而表标记集不在stackOverflow白名单中.(我是新来的,所以也许有办法做到这一点,但我不知道.)
此外,我通过改变解决了当前的问题
if(event.keyCode=='13')
{
$('#gradeUpdate').blur();
}
至
if(event.keyCode=='13')
{
$("#gradeUpdate").parent().focus();
//$('#gradeUpdate').blur();
}
但我仍然想知道为什么原来的线不只是让#gradeUpdate模糊,就像我想的那样.
一切都发生在这个功能内:
function clickableCell(){
$("td.assignmentCell").click(function(){ //if a td with an assignment class is clicked,
if( clicked == 0)
{
clicked = 1;
currentValue = $(this).text();//get the current value of the entered grade
var passable = this;
alert("Test: passable is: "+$(passable).text());
//change content to be an editable input form element
$(this).html("<input name='gradeUpdate' id='gradeUpdate' size=3 value='"+currentValue+"' type='text' />");
//move the cursor to the …当页面加载时，我正在用javascript写一个简单的无限计数器开始计数
当鼠标指针位于视口之外时，我想停止计数器
请帮忙？
var i=0;
setInterval(function (){
i++;
document.getElementById("counterLoop").innerHTML=i;
},1000);
var viewportWidth = document.documentElement.clientWidth;
var viewportHeight = document.documentElement.clientHeight;
function getCursorXY(e) {
CurX = (window.Event) ? e.pageX : event.clientX + (document.documentElement.scrollLeft ? document.documentElement.scrollLeft : document.body.scrollLeft);
CurY = (window.Event) ? e.pageY : event.clientY + (document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop);
}
如何捕获视口宽度和高度的鼠标移动事件
javascript ×5
jquery ×4
ajax ×1
blur ×1
events ×1
html5 ×1
loops ×1
mouseleave ×1
mouseout ×1
prototypejs ×1
safari ×1
viewport ×1