标签: javascript-events

在我的网页上,我有一个文件列表.

每个文件都在它自己的容器div中(div class ="file").容器内部是文件和描述的链接.

我想允许用户单击容器上的任何位置来下载文件.我通过向容器添加click事件并检索子链接的href来完成此操作.

当文件在新窗口中打开时,如果用户实际单击该链接,则该文件将打开两次.

因此,我需要在单击超链接时阻止触发父容器单击事件.这样做的最佳方法是将超链接功能添加到超链接to0并设置event.stopPropagation吗？据推测,这将阻止事件冒泡到集装箱.

谢谢Ben

在没有jQuery的情况下,在Javascript中实现mouseenter/mouseleave类似事件的最佳方法是什么？跨浏览器使用的最佳策略是什么？我正在考虑对mouseover/mouseout事件处理程序中的event.relatedTarget/event.toElement属性进行某种检查？

喜欢听你的想法.

简而言之,我的问题是我想Esc通过一行javascript 来执行按钮的效果,例如执行效果Esc点击按钮.我该怎么做 ？

[我有一个jQuery框中的上传,所以我希望当上传完成后,将自动执行转义功能关闭框]

感谢Perfection kills,我们可以使用以下JavaScript来检测事件支持:

function hasEvent(ev) {
    var elem = document.createElement('a'),
        type = 'on' + ev,
        supported = elem[type] !== undefined;
    if (!supported) {
        elem.setAttribute(type, 'return;');
        supported = typeof elem[type] === 'function';
    }
    elem = null;
    return supported;
}

这只适用于我需要的时间:检测mouseenter支持; hasEvent('mouseenter')将在Chrome,Firefox等中返回false,应该如此.

但现在我正在尝试"修复"不支持focusin和focusout事件的浏览器.根据PPK,这基本上只是Firefox.不幸的是,Chrome和Safari被列为"不完整"支持,原因如下:

Safari和Chrome仅使用addEventListener触发这些事件; 不是传统的注册.

一般来说,这很好; addEventListener反正我只会用.但是,它确实意味着检测支持通过elem.onfocusin !== undefined将不起作用.我测试了它,这是真的:

<p>Do I support <a href="#">focusin</a>?</p>

<script>
var elem = document.getElementsByTagName('p')[0];

// hasEvent method defined here
function listener() { …

我希望在鼠标靠近桌面元素时跟踪并显示工具提示.它适用于该mouseenter事件,但我希望mouseenter在它接近之前显示工具提示.另外,我希望在mouseout距离桌头一定距离后删除工具提示.

这是我的代码.

$('thead').mouseenter(showtooltip);
$('thead').mouseout(removetooltip);

我怎么能用jQuery做到这一点？

在雅虎天气页面上,有一个链接标记为C将温度单位从更改Fahrenheit为Celsius.

我正在调试这个动作,并了解在将F转换为C的幕后执行的javascript是什么.调试这些事情的方式是什么？

链接:http://weather.yahoo.com/？w = 2295401

过去,当检测设备是否支持JavaScript中的触摸事件时,我们可以执行以下操作:

var touch_capable = ('ontouchstart' in document.documentElement);

但是,true即使底层设备不支持触摸事件,Google Chrome(17.x.x +)也会返回上述检查.例如,在Windows 7上运行上面的代码返回true,因此如果我们将它与以下内容结合起来:

var start_evt = (touch_capable) ? 'ontouchstart' : 'onmousedown';

在Google Chrome上,由于我们绑定了该事件,因此该事件永远不会被触发ontouchstart.简而言之,有没有人知道绕过这个的可靠方法？我目前正在运行以下检查:

var touch_capable = ('ontouchstart' in document.documentElement && navigator.userAgent.toLowerCase().indexOf('chrome') == -1)

这远非理想......

下图取自Jon Resig所着的" Jinja of JavaScript Ninja "一书的第3章.这里作者解释了浏览器事件循环.

这本书不得不说:

重要的是要注意将事件放入队列的浏览器机制在此事件循环模型的外部.确定事件何时发生并将其推送到事件队列所需的处理不参与处理事件的线程.

所以我的问题是,说浏览器中的JavaScript是单线程的吗？我问这个问题,因为显然有两个单独的任务(处理事件和事件排队在这里并行进行).

我试图追溯哪个函数挂钩到click事件中.someclass.我打开Chrome Dev Tool并输入

getEventListeners(document.querySelector('.someclass'));

结果就是这样

Object {}

我无法单击并打开它以查找对象的名称或处理单击事件的源代码.

有没有办法找出来？

更新1:

跟随Krasimir的建议如下.可能只有两个事件:mousemove或mouseover.那么我该如何找到处理该事件的确切函数canvas.overlay呢？有太多可以深入研究.

我试图在phonegap上检测showKeyboard和hidekeyboard事件.为此,在deviceready事件中我放置了以下代码:

  bindEvents: function() {
    document.addEventListener('deviceready', this.onDeviceReady, false);
},
// deviceready Event Handler
//
// The scope of 'this' is the event. In order to call the 'receivedEvent'
// function, we must explicity call 'app.receivedEvent(...);'
onDeviceReady: function() {
    document.addEventListener("menubutton",app.onMenuKeyPress,false);
    document.addEventListener("backbutton",navigateBack,false);
    document.addEventListener("hidekeyboard", onKeyboardHide, false);
    document.addEventListener("showkeyboard", onKeyboardShow, false);
},

这里后退按钮事件被解雇和罚款,但工作hidekeyboard和showkeyboard事件从未被触发.

为了检测它,我尝试使用window.onresize在浏览器中工作的事件.以下是其代码:

window.onresize = function(){
    var screenHeight = $(window).height();
    alert(screenHeight);
    var diff = screenInitialHeight - screenHeight;
    var newHeight = screenInitialHeight-diff;
    alert(newHeight);
    $('#mainpage').height(newHeight);
    $('#nav_container').height(newHeight);
}

但是这段代码也没有在show或hide键盘上执行.此功能仅在首次应用时执行.开始了.我在某些地方看到,对于某些人来说这些事件正在发挥作用,所以我觉得我身边有一些问题,可能是在一些配置文件等等.所以下面是androidmanifest.xml代码:

    <?xml version='1.0' encoding='utf-8'?> …