Question

我使用jQuery编写了一些代码来执行ajax调用，并在用户将焦点移离字段时在页面上显示消息。我的字段名为txtLogin，用户键入一些文本并单击按钮以使用给定的txtLogin值在数据库中创建新的用户帐户。

问题是有效值必须包含四个字母，短划线，然后再包含四个字母。我的客户坚持认为表单应该有两个字段，一个用于前四个字母，另一个用于后四个字母。

假设这两个字段被称为txtLogin0和txtLogin1。当用户将焦点移离字段时，我仍然想要进行ajax调用，但是当用户从两个字段之一移动到另一个字段时，不应调用ajax调用！

我目前的代码是这样的。

$('#txtLogin').blur(function() {
    var login = $(this).val();
    var isValid = testLogin(login);
    if (!isValid) alert('Login is invalid');
});

我想我的新代码看起来像这样：

$('#txtLogin0').add('#txtLogin1').blur(function() {
    var focusId = The Id of the newly focused element
    if (focusId==='txtLogin0' || focusId==='txtLogin1) return
    var login = $(#txtLogin0').val() + '-' + $('#txtLogin1').val();
    var isValid = testLogin(login);
    if (!isValid) alert('Login is invalid');
});

如何在jQuery.blur事件中获取焦点移动到的元素的id？

Answer 1

一个简单的hack是创建两个var来存储onfocus和onblur中的当前和前一个元素，并在一个定时器内调用validate方法，该方法将在0毫秒内触发。请尝试以下代码，我认为它接近你想要的。

DEMO

var prevEl, curEl;
$(document).ready(function() {
    $('#txtLogin0, #txtLogin1').blur(function() {
        prevEl = this.id;

        setTimeout(validateLogin, 0);

    }).focus(function() {
        curEl = this.id;
    });
});

function validateLogin() {
    if ((prevEl === 'txtLogin0' && curEl === 'txtLogin1') || (curEl === 'txtLogin0' && prevEl === 'txtLogin1')) {
        return;
    }
    prevEl = ''; curEl = '';
    var login = $('#txtLogin0').val() + '-' + $('#txtLogin1').val();
    var isValid = testLogin(login);
    if (!isValid) alert('Login is invalid');
}

function testLogin(txt) {
    return false;
}

Answer 2

var focusId = $(this).attr('id');

获取元素焦点的id是否转移到jQuery.blur事件中？

2 个答案: