Question

我设计了一个自动完成功能，当一个人在文本框中输入至少3个字母时，将通过几个火车站数据库中的一个来查找具有这三个（或更多）的所有可能的站点字母。

该功能完美无缺，在打开网页时，自动完成列表会提供正确的电台。

但是，用于生成自动完成建议的数据库选择基于用户输入页面上的下拉列表。

目前使用的数据库是基于页面加载时选择的选项（所以顶部选项），我似乎无法在用户输入更改时更改此选项。

以下是代码的问题部分：

$(function () {

    for(i=0;i<30;i++){
        $("#_Q6_Q" + i + "_Q3_C").change(function(){
            transportChange($("#_Q6_Q" + i +"_Q3_C").val(), i)
        });
    };
}

以下是transportChange函数如何使用参数的粗略示例：

function transportChange(lst, i) {
    /* lst = input into Mode of Transport question.
       i correlates to the row number - these are auto generated when
       the respondent changes their answer.
    */

    //Blank auto complete box
    //Use for loops to generate numbers correlating to input boxes
    for(var q=5; q<7; q++){
        for(var u=0; u<3; u++){
            $("#_Q6_Q".concat(String(i),"_Q", String(q), "_Q0_Q", String(u))).val('');
        };
    };

    // disable drop down and auto complete boxes whilst loading data;
    $("#_Q6_Q".concat(String(i),"_Q4_Q0_Q0")).prop('disabled', true);
}

我可以告诉你，'lst'参数被连接成一个链接，然后定义将使用哪个数据库。

自动完成功能来自JQuery。

Answer 1

忽略第一个for循环中缺少的var（技术上将i置于全局范围内），以及您正在应用回调函数的事实 30 上的更改事件选择框（这是正确的吗？！） ...

看起来问题 - 至少是第一部分 - 是回调共享相同的执行范围。这意味着在所有函数i中将始终等于分配的最后一个值（30）。

这种行为比我在这里做的要好得多：How do Javascript closures work?

所以...请你按照以下方式更新你的第一个代码块：

$(function(){

    for(var i=0; i<30; i++){
        $("#_Q6_Q"+ i +"_Q3_C").change(callbackFactory(i));
    }

    function callbackFactory(i){
        return function(){
            transportChange($("#_Q6_Q"+ i +"_Q3_C").val(), i);
        };
    }
    // ...
});

这将确保生成的每个函数都封装在它自己的范围（并且i将是您认为的那样） - 这是我到目前为止发现的唯一逻辑漏洞，如果它不起作用，那么我们需要更多的信息。

从DropDownList中选择选项时激活功能

1 个答案: