0

我想向一个站点添加一个自动完成功能，发现本指南使用了一些 js 代码，这对一个文本框非常有用：http ://www.sks.com.np/article/9/ajax-autocomplete-using-php -mysql.html

但是，当尝试添加多个自动完成时，只有最后一个 tetbox 会起作用，因为它是最后一组。

这是为js脚本设置变量的函数

function setAutoComplete(field_id, results_id, get_url)
{

// initialize vars
acSearchId  = "#" + field_id;
acResultsId = "#" + results_id;
acURL       = get_url;

// create the results div
$("#auto").append('<div id="' + results_id + '"></div>');

// register mostly used vars
acSearchField   = $(acSearchId);
acResultsDiv    = $(acResultsId);

// reposition div
repositionResultsDiv();

// on blur listener
acSearchField.blur(function(){ setTimeout("clearAutoComplete()", 200) });

// on key up listener
acSearchField.keyup(function (e) {

    // get keyCode (window.event is for IE)
    var keyCode = e.keyCode || window.event.keyCode;
    var lastVal = acSearchField.val();

    // check an treat up and down arrows
    if(updownArrow(keyCode)){
        return;
    }

    // check for an ENTER or ESC
    if(keyCode == 13 || keyCode == 27){
        clearAutoComplete();
        return;
    }

    // if is text, call with delay
    setTimeout(function () {autoComplete(lastVal)}, acDelay);
});
}

对于一个文本框，我可以像这样调用函数

$(function(){      
setAutoComplete("field", "fieldSuggest", "/functions/autocomplete.php?part=");
});

但是，当使用多个文本框时，我不确定我应该如何去做，这是我尝试过的，但没有奏效

$('#f1').focus(function (e) {   
    setAutoComplete("f1", "fSuggest1", "/functions/autocomplete.php?q1=");
}
$('#f2').focus(function (e) {   
    setAutoComplete("f2", "fSuggest2", "/functions/autocomplete.php?q2=");
}

谢谢你的帮助。

4

1 回答 1

0

您应该使用类来使您的函数在同一页面上的多个元素中工作。只需删除固定 ID 并执行 forEach 以针对该类的每个元素。

于 2012-11-04T17:10:09.250 回答