在JQuery中，如何在用鼠标单击选择输入时进行操作？

正如您在下面看到的，我在公式中选择了一些历史地址，因此，当我选择一个并按“回车”时，颜色将适应（如果是邮件地址，则变为绿色，如果不是，则保持红色）。我使用这段代码（JQuery）实现了这一点：

但问题是，如果我用鼠标点击“历史记录”电子邮件地址而不是按“回车”，什么也不会发生（即使我选择了邮件地址）。因此，我尝试了其他JQuery函数，如

.mouseup（）

或

.click（）

，但仍然不起作用

你有什么想法吗？

试试这个：

$('#selector').focus(function(){
    // your code here
});

focus

当元素从鼠标选择或选项卡获取焦点时，将触发事件。

您可能需要尝试以下方法：

我建议使用。这将在元素失去焦点时触发。使用

keyup

将在每次按下某个键时触发，而这不是您想要执行的操作

$( "#mail" ).on('blur', function() {
    if(!validateEmail($("#mail").val())) {
        $("div.mail").removeClass("has-success");
        $("div.mail").addClass("has-error");
    }
    else{
        $("div.mail").removeClass("has-error");
        $("div.mail").addClass("has-success");
    }
});

$（函数（）{
$（“#mail”）.on（'keyup'，function（）{
如果（！validateEmail（$（“#mail”）.val（））{
$（“#mail”）.removeClass（“已成功”）；
$（“#mail”）.addClass（“有错误”）；
}否则{
$（“#mail”）.removeClass（“有错误”）；
$（“#mail”）.addClass（“已成功”）；
}
});
$（'input'）。在（'change'，function（）{
如果（！validateEmail（$（“#mail”）.val（））{
$（“#mail”）.removeClass（“已成功”）；
$（“#mail”）.addClass（“有错误”）；
}否则{
$（“#mail”）.removeClass（“有错误”）；
$（“#mail”）.addClass（“已成功”）；
}
});
功能验证电子邮件（电子邮件）{
变量re=/^（[^（）\[\]\\，；：\s@“]+（\.[^（）\[\]\，；：\s@“]+）*）（“+”）（\[[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[0-9]{1,3}.[1,3}.[0-9]{1,3}.]124；（[a-zA Z-0-9]++\]；
返回重新测试（电子邮件）；
}
});
。成功了{
边框颜色：绿色；
}
.有错误{
边框颜色：红色；
}

Hello，Run Snippet=>click on input=>select A history research with arrows=>click on the mouth=>它仍然是红色（而不是绿色）Hello，这不是我想要的，我需要在单击选择历史项目时更改颜色。输入框中的历史项目？在每次击键时运行这种类型的检查有点过分。不管怎样，他们不会在第一次击键时就开始使用有效的电子邮件地址。
$( "#mail" ).change(function() {

    if(!validateEmail($("#mail").val())) {
        $("div.mail").removeClass("has-success");
        $("div.mail").addClass("has-error");
    }
    else{
        $("div.mail").removeClass("has-error");
        $("div.mail").addClass("has-success");
    }

});

$( "#mail" ).on('blur', function() {
    if(!validateEmail($("#mail").val())) {
        $("div.mail").removeClass("has-success");
        $("div.mail").addClass("has-error");
    }
    else{
        $("div.mail").removeClass("has-error");
        $("div.mail").addClass("has-success");
    }
});