焦点事件后未触发点击事件 [英] Click event not triggered after focusout event

问题描述

聚焦"事件之后，不会触发click事件.

After the Focusout event, the click event is not triggered.

我的设计是

<textarea id="txt"></textarea>
<input type="button" id="btnClick" value="Submit" />

jQuery，

$(document).ready(function () {
var field = $("#txt");
var btn = $("#btnClick");
field.on("focusin", f1);
field.on("focusout", f2);
btn.on("click", f3);

function f1() {
    field.removeClass("c1").addClass("c2");
}

function f2() {
    field.removeClass("c2").addClass("c1");
}

function f3() {
    alert('hi');
}
});

样式

.c1 { height:40px; }
.c2 { height:250px;}

我还附了小提琴此处.

推荐答案

那是因为按钮移动位置后，没有足够的时间来触发点击.如果按住鼠标不放并将鼠标移到该按钮上，然后单击松开，则可以看到单击有效.

Thats because it doesn't have enough time to get the click to trigger since the button moves position. You can see the click works if you hold the mousedown and move the mouse to the button and let the click go and you'll see click works.

使用btn.on('mousedown',f3);或定位按钮，使其在对焦时不会移动

Either use btn.on('mousedown',f3); or position the button so it doesn't get moved on focusout

DEMO鼠标按下

DEMO按钮定位

点击的工作方式是，您可以将鼠标悬停在某个元素上，同时将鼠标悬停在其上，即当它触发点击时

The way click works is that you have mousedown on an element and mouseup on it aswell, thats when it triggers click

这篇关于焦点事件后未触发点击事件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！