Jquery失去焦点事件

Question

Jquery失去焦点事件

6

我有一个文本框，它有一个失去焦点事件。当文本框失去焦点（Tab、鼠标单击表单的任何其他部分）时，根据某些条件，调用用户编写的函数显示一个警报。

现在，我的表单还有一个按钮，在填写文本框后，当我点击按钮时，文本框的focusOut事件被调用，而不是按钮的点击事件。

如何停止在单击按钮时调用文本框的foucusout事件？

 ("$textbox").focusout(function(){
validation;
alert("message");
});

("$btn").click(function(){
----
});

can any one help me?

- jack_jill

你能提供更多上下文吗？如果这是为了表单验证，那么在每个文本框的焦点离开时进行警告似乎非常不必要。如果只是想在提交表单之前显示摘要，则有其他（更好的）方法可以实现此目的。 - Town

这是一种额外的验证方式，除了文本框的正常验证之外，在提交表单之前需要进行。我需要在用户单击或移动到下一个文本框或单击任何其他字段时向用户显示确认框。 - jack_jill

3个回答

0

你是否无法触发 focusout 事件，而紧接着是按钮 click 事件？

也许 alert 正在阻止按钮 click 完成。

尝试删除 alert 来测试两个事件是否都能触发。

更新：

也许 mousedown 事件会比 click 更好，因为它将在 mousedown 上注册，而不是在 mouseup 事件上触发 click。

- Chris Snowden

嗨，focusout 中的警报是必需的。只有文本框的 focusout 事件被调用，而不是按钮点击事件。有没有办法阻止文本框的 focusout 事件在按钮点击时被调用？ - jack_jill

问题在于 focusout 事件将在按钮 click 事件的 mousedown 上发生，但是按钮点击可能要等到 mouseup 事件，而该事件可能被警报阻止。我建议暂时移除此操作以确认是否导致了问题。 - Chris Snowden

我尝试使用鼠标按下事件，但没有帮助，我仍然可以得到焦点离开的警报.. 我不想显示这个警报。 - jack_jill

我不确定你是否能够这样做，因为focusout事件在click事件之前发生。你需要在mousedown中标记一些内容，然后让focusout事件来处理它，但是focusout事件可能总是先于mousedown事件发生，这可能会导致无法实现这个功能。 - Chris Snowden

0

我认为JQuery选择器使用$。所以在我看来，你在这里唯一的错误就是错误地放置了“$”美元符号。

这样怎么样呢？（假设TextBox具有class="textbox"，而Button具有class='btn'）

$(".textbox").focusout(function(){
    alert('MsgBox');
});

$(".btn").click(function(){
    alert('Button');    
});

如果你有 ID 而不是 class，请像下面这样更改选择器

$("#textbox") AND $("#btn")

http://jsfiddle.net/dAa2R/6/

- Talha Ahmed Khan

问题在于focusout事件仍在触发，这导致了OP应用程序中的弹出窗口。 - cillierscharl

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- cillierscharl · Accepted Answer

我已经将你的点击事件更改为mousedown事件（这样它会先触发），并使用一个变量来追踪你的点击：

var buttonClicked = false;

$('#txt1').focusout(function(){
    if(!(buttonClicked)){
        alert('BlurEvent');
    }else{
        buttonClicked = false;
    }
});

$('#btn').mousedown(function(event){
    alert('ClickEvent');
    buttonClicked = true;
});

http://jsfiddle.net/924SZ/

EDIT

var buttonClicked = false;

$('#txt1').focusout(function(){
    if(!(buttonClicked)){
        // do normal focusout code.
    }else{
        // button was clicked - dont execute some code.
        buttonClicked = false;
    }
    //this always executes regardless of focusout or button click
    var reply =confirm("Are you happy with the input?");
});

$('#btn').mousedown(function(event){

    buttonClicked = true;
});