jquery – 焦点输出事件后未触发的Click事件

在Focusout事件之后,不会触发click事件.

我的设计是,

<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;}

而且我还附上了fiddle here.

解决方法

那是因为它没有足够的时间让按钮移动位置触发点击.如果您按住mousedown并将鼠标移动到按钮并点击该按钮,您可以看到点击有效,您将看到点击工作.

要么使用btn.on(‘mousedown’,f3);或定位按钮,使焦点不会移动

DEMO mousedown

DEMO button positioned

点击工作的方式是你在元素和鼠标上都有mousedown,也就是当它触发点击时

原文地址：https://www.jb51.cc/jquery/177517.html