javascript - jQuery、多个输入和 onBlur

Question

所以我有 2 个输入。两者都是为了“自动完成”。我还有两个函数做几乎相同的事情...每个输入调用不同的函数 onBlur。问题是，第二个输入为第二个输入选择“建议”后，它会填充第一个输入。我该怎么做才能使第二个填充第二个？

可能有更好的方法来做到这一点，但我的 jQuery/Javascript 知识有限，而且我已经没有时间了......谢谢!

代码:

function fillLocation(thisValue) {
    $('#location-box').val(thisValue);
    setTimeout("$('#suggestionsLocation').fadeOut('fast');", 200);
}

function fillTerms(thisValue) {
    $('#terms-box').val(thisValue);
    setTimeout("$('#suggestionsTerms').fadeOut('fast');", 200);
}


<input type="text" name="search_location" id="location-box" value="" onkeyup="suggestLocation(this.value);" onblur="fillLocation();" autocomplete="off" />

<input type="text" name="search_terms" id="terms-box" value="" onkeyup="suggestTerms(this.value);" onblur="fillTerms();" autocomplete="off" />

Answer 1

我想我假设您想要为具有相似功能的两个输入触发 keyup 和模糊事件，并且这两者都会影响相同的输入。

这是一种方法。在 javascript(而不是 HTML)中绑定(bind)事件，并运行正确的代码

$('document').ready(function() {

    $('#location-box,#terms-box')
                    .bind('keyup', function() {
                           // do your keyup thing using $(this)
                           // to refer back to the input
                           //$('body').append($(this).attr('id') + ': keyup<br />');
                           var theValue = $(this).val();
                     }) 
                     .bind('blur', function() {
                           // do your blur thing using $(this)
                           // to refer back to the input
                           //$('body').append($(this).attr('id') + ': blur<br />');
                     })
    });


<input type="text" name="search_location" id="location-box" value="" autocomplete="off" />
<input type="text" name="search_terms" id="terms-box" value="" autocomplete="off" />

编辑:

取消注释 $('body') 行以查看正在运行的事件。

希望这就是您正在寻找的内容。

编辑:添加到 keyup 事件的代码中以检索值